精华内容
下载资源
问答
  • JS工厂模式

    2019-10-08 16:00:00
    什么是工厂模式工厂模式是一种用来创建对象的设计模式。我们不暴露对象创建的逻辑,而是将逻辑封装在一个函数内,那么这个函数可以成为工厂。工厂模式根据抽象程度的不同可以分为:1.简单工厂 2.工厂方法 3.抽象...

    什么是工厂模式?

    工厂模式是一种用来创建对象的设计模式。我们不暴露对象创建的逻辑,而是将逻辑封装在一个函数内,那么这个函数可以成为工厂。工厂模式根据抽象程度的不同可以分为:1.简单工厂 2.工厂方法 3.抽象工厂

     

    1.简单工厂:

    let  factory = function (role) {
    function superman() {
        this.name ='超级管理员',
        this.role = ['修改密码', '发布消息', '查看主页']
    }
    
    function commonMan() {
        this.name = '普通游客',
        this.role = ['查看主页']
    }
    
    switch(role) {
        case 'superman':
        return new superman();
        break;
        case 'man':
        return new commonMan();
        break;
        default:
        throw new Error('参数错误')
    }
    
    }
    
    let superman = factory('superman');
    let man = factory('man');

    在上述代码中,factory就是一个简单的工厂,该工厂中有二个构造函数分别对应不同的权限。我们只需要传递相应的参数就可以获取一个实例对象了。工厂内部的构造函数有相似的地方,还可以进一步优化。

    let  factory = function (role) {
    function User(obj) {
        this.name = obj.name;
        this.role = obj.role;
    }
    switch(role) {
        case 'superman':
        return new User({ name: '平台用户', role: ['主页', '登录页'] })
        break;
        case 'man':
        return new User({ name: '游客', role: ['登录页']})
        break;
        default:
        throw new Error('参数错误')
    }
    }
    
    let superman = factory('superman');
    let man = factory('man');

    简单工厂的优点: 你只需要传递一个合法的参数,就可以获取到你想要的对象,而无需知道创建的具体的细节。但是在函数内包含了所有对象的构造函数和判断逻辑的代码, 每次如果需要添加一个对象,那么我们需要新增一个构造函数,当我们需要维护的对象不是上面这2个,而是20个或者更多,那么这个函数将会成为超级函数,使得我们难以维护。所以简单工厂模式只适用于在创建时对象数量少,以及逻辑简单的情况。

    2.工厂方法:

    工厂方法模式本意是将实际创造的对象推迟到子类中,这样核心类就变成了抽象类。但是在js中很难像那些传统面向对象语言那样去实现抽象类,所以在js中我们只需要参考他的思想即可。

    我们可以把工厂函数看成是一个工厂类。在简单模式我们,我们添加一个新的对象需要修改二处地方,在加入工厂方法模式以后,我们只需要修改一处即可。工厂方法的工厂类,他只做实例化这一件事情。我们只需要修改他的原型类即可。我们采用安全模式创建工厂对象。

    let factory = function (role) {
        if(this instanceof factory) {
            var s = new this[role]();
            return s;
        } else {
            return new factory(role);
        }
    }
    
    factory.prototype = {
        admin: function() {
            this.name = '平台用户';
            this.role = ['登录页', '主页']
    
        },
        common: function() {
            this.name = '游客';
            this.role = ['登录页']
        },
        test: function() {
            this.name = '测试';
            this.role =  ['登录页', '主页', '测试页'];
            this.test = '我还有一个测试属性哦'
        }
    }
    
    let admin = new factory('admin');
    let common = new factory('common');
    let test = new factory('test');

    在上述代码中要是忘记加new了, 那么我们就获取不到admin,common等对象了,使用安全模式可以很好的解决这个问题。

    转载于:https://www.cnblogs.com/xiaogua/p/10502892.html

    展开全文
  • JS 工厂模式

    2019-07-09 01:12:50
    <!DOCTYPE html> <html> <head> <meta charset="UTF-8">... //工厂模式,继承父类方法,创造不同对象, ... //工厂模式,就是一个封装了创建相似对象的类。 function P...
    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<script>
    		//工厂模式,继承父类方法,创造不同对象,
    		//工厂模式,就是一个封装了创建相似对象的类。
    			function PeopleFactory(){
    			}
    			
    			PeopleFactory.prototype = {
    				 createFacotry:function(){
    				 	throw "this is a baseClass";
    				 }
    			}
    			
    			function SubPeopleFactory(){
    				PeopleFactory.call(this);
    			}
    			//------继承-----
    			SubPeopleFactory.prototype = new PeopleFactory();
    			SubPeopleFactory.prototype.constructor = SubPeopleFactory;
    			//------end-------
    			//-------重写-----
    			SubPeopleFactory.prototype.createFacotry = function(){
    				var info = {
    					gongRen:function(){
    						return "Workers";
    					},
    					nongMing:function(){
    						return "fammer";
    					},
    					xueSheng:function(){
    					   return "student";
    					}
    				}
    			  return info;
    			}
    			//---------end-----------
    			var sp = new SubPeopleFactory();
    			var ob = sp.createFacotry()['gongRen']();
    			console.log(ob);
    		</script>
    	</head>
    	<body>
    	</body>
    </html>
    

      

    转载于:https://www.cnblogs.com/yqlog/p/5560501.html

    展开全文
  • js工厂模式

    2018-03-09 12:55:00
    js 简单工厂模式 var MacBikeFactory = { createBike : function() { return new MacBike(); } } function IMacBike() {} function MacBike() {} MacBike.prototype = { const...

    js 简单工厂模式

    var MacBikeFactory = {  
      createBike : function() {  
        return new MacBike();  
      }  
    }  
    function IMacBike() {}  
    function MacBike() {}  
        MacBike.prototype = {  
        constructor : MacBike,  
        getBike: function() {  
            console.log("创建一台Mac车");  
      }  
    }  
    var macFn = MacBikeFactory.createBike();  
    macFn.getBike(); 

     

    js 抽象工厂模式

    // 接口  
    var Interface = function(name, methods) {  
        if (arguments.length != 2) {  
            throw new Error("Interface constructor called with " + arguments.length  
                    + "arguments, but expected exactly 2.");  
        }  
      
        this.name = name;  
        this.methods = [];  
        for (var i = 0, len = methods.length; i < len; i++) {  
            if (typeof methods[i] !== 'string') {  
                throw new Error("Interface constructor expects method names to be "  
                        + "passed in as a string.");  
            }  
            this.methods.push(methods[i]);  
        }  
    };  
    // 接口检查  
    Interface.ensureImplements = function(object) {  
        if (arguments.length < 2) {  
            throw new Error("Function Interface.ensureImplements called with "  
                    + arguments.length + "arguments, but expected at least 2.");  
        }  
      
        for (var i = 1, len = arguments.length; i < len; i++) {  
            var v_interface = arguments[i];  
            if (v_interface.constructor !== Interface) {  
                throw new Error("Function Interface.ensureImplements expects arguments "  
                        + "two and above to be instances of Interface.");  
            }  
      
            for (var j = 0, methodsLen = v_interface.methods.length; j < methodsLen; j++) {  
                var method = v_interface.methods[j];  
                if (!object[method] || typeof object[method] !== 'function') {  
                    throw new Error("Function Interface.ensureImplements: object "  
                            + "does not implement the " + v_interface.name  
                            + " interface. Method " + method + " was not found.");  
                }  
            }  
        }  
    };  
    // 原形继承  
    function clone(object) {  
        function F() {  
        }  
        F.prototype = object;  
        return new F;  
    }  
      
    // 抽象工厂  
    var AbstractFactory = (function() {  
        // 抽象方法检查  
        function checkImplements(object) {  
            var isContain = false;  
            var v_method = '';  
            if (arguments.length < 2) {  
                throw new Error("Function AbstractFactory.checkImplements called with "  
                        + arguments.length + "arguments, but expected at least 2.");  
            }  
            for (var i = 1; i < arguments.length; i++) {  
                var v_AbstractClass = arguments[i];  
                for (key in v_AbstractClass) {  
                    if (!object[key] && typeof object[key] !== 'function'  
                            && key != 'getFactory') {  
                        isContain = true;  
                        v_method = key;  
                        break;  
                    }  
                }  
            }  
            if (isContain) {  
                throw new Error("Function AbstractFactory.ensureImplements: object "  
                        + "does not implement the AbstractFactory "  
                        + "AbstractCalss. AbstractMethod "  
                        + v_method  
                        + " was not found.");  
            }  
        }  
        // 选择具体工厂  
        function chooesFactory(mode) {  
            var factory = null;  
            switch (mode) {  
                case 'giant' :  
                    factory = GiantFactory;  
                    break;  
                case 'cnforever' :  
                    factory = CnforeverFactory;  
                    break;  
                case 'merida' :  
                    factory = MeridaFactory;  
                    break;  
                default :  
                    throw new Error("mode not found");  
            }  
            checkImplements(factory, AbstractFactory)  
            return factory;  
        }  
        return {  
            getFactory : function(mode) {  
                return chooesFactory(mode);  
            },  
            // 抽象方法  
            createBicycle : function() {  
                throw new Error('Unsupported operation on an abstract class:createBicycle');  
            }  
        }  
    })();  
    // 继承  
    var GiantFactory = clone(AbstractFactory);  
    GiantFactory = {  
        // 实现父类抽象方法  
        createBicycle : function() {  
            var giantBicycle = new GiantBicycle();  
            Interface.ensureImplements(giantBicycle, Bicycle);  
            return giantBicycle;  
        }  
    };  
    // 创建接口  
    var Bicycle = new Interface("Bicycle", ['assemble', 'wash', 'ride', 'repair']);  
    var GiantBicycle = function() {  
      
    };  
    // 实现接口  
    GiantBicycle.prototype = {  
        assemble : function() {  
            alert('组装');  
        },  
        wash : function() {  
            alert('清洗');  
        },  
        ride : function() {  
      
        },  
        repair : function() {  
      
        }  
    };  
      
    var BicycleShop = function() {  
    };  
    // 入口  
    BicycleShop.prototype = {  
        sellBicycle : function(mode) {  
            var bicycle = AbstractFactory.getFactory(mode).createBicycle();  
            bicycle.assemble();  
            bicycle.wash();;  
            return bicycle;  
        }  
    }  
      
    var bicycleShop = new BicycleShop();  
    bicycleShop.sellBicycle('giant');  

     

     

    js 抽象工厂模式

     

    转载于:https://www.cnblogs.com/bkpjm/p/8533110.html

    展开全文
  • js 工厂模式

    2016-08-06 21:46:00
    工厂模式是管理对象的一种设计模式,通过向外提供一个公共方法用于创建对象。把使用对象的部分与创建对象的部分分离,创建对象部分与对象创建前的初始化分离,职责分离。jQuery.Callbacks是一个工厂,每次调用都会...

    工厂模式是管理对象的一种设计模式,通过向外提供一个公共方法用于创建对象。把使用对象的部分与创建对象的部分分离,创建对象部分与对象创建前的初始化分离,职责分离。jQuery.Callbacks是一个工厂,每次调用都会返回一个对象,并且根据传入的不同参数值返回的对象具有不同的特征。

    1.简单工厂模式

    在工厂方法中,根据传入的参数创建相应的对象,并且返回。

      function Orange(){
            this.color = 'orange';
        }
        function Apple(){
            this.color = 'red';
        }
        function Banana(){
            this.color = 'yellow';
        }
        // 创建对象的工厂
        function SimpleFactory(type){
            var fruit = null;
            switch(type){
                case 'orange':
                    fruit = new Orange();
                    break;
                case 'apple':
                    fruit = new Apple();
                    break;
                case 'banana':
                    fruit = new Banana();
            }
            return fruit;
        }
    
        //测试
        var apple = SimpleFactory('apple');
        console.log(apple.color);
        var banana = SimpleFactory('banana');
        console.log(banana.color);

     简单工厂模式只能产生工厂方法中指定类型的对象,当需要添加其他类型的对象时,需要在工厂方法中添加相对应的代码。

    2.工厂模式

    工厂模式对简单工厂模式改进,可以扩展新的类型的对象,并且不用修改工厂方法。

      function Fruit(){}
        Fruit.prototype.say = function(){
            return 'hello,my name is ' + this.name;
        }
        Fruit.Apple = function (){
            this.name = 'apple';
        }
        Fruit.Banana = function(){
            this.name = 'banana';
        }
        Fruit.Orange = function(){
            this.name = 'orange';
        }
        Fruit.factory = function(type){
            var fruit = null;
            //如果构造函数不存在,返回
            if(typeof Fruit[type] !== 'function'){
                return;
            }
            //使用原型继承父类
            if(typeof Fruit[type].prototype.getColor !== 'function'){
                Fruit[type].prototype = new Fruit();
            }
            //创建对象
            fruit = new Fruit[type]();
            return fruit;
        }
    
        //测试
        var apple = Fruit.factory("Apple");
        console.log(apple.say());

     

    转载于:https://www.cnblogs.com/fe-huahai/p/5744607.html

    展开全文
  • 主要介绍了JS工厂模式开发,结合具体实践案例形式分析了基于javascript工厂模式实现的轮播功能相关操作技巧,需要的朋友可以参考下
  • JS工厂模式开发实践

    2019-10-07 17:08:45
    JS工厂模式开发实践 基于JS工厂模式的H5应用,实现了轮播图功能与滑屏功能,并且实现了文字大小的自适应功能,基于SASS样式开发。 核心的JS代码如下: index.js define(function(){ var self = null, ...
  • 复杂工厂模式 ** 工厂模式转变为复杂工厂模式–也就是由粗粒度变成细粒度。也就是每个对象实现的方法的变得更具体化。** 看下面代码,同上文一样要先插入CommonUtil.js文件。 <script> // 复杂工厂模式(由粗...
  • 工厂模式 简单工厂: var factory = function (name, age, sex, national) { this.name = name; this.age = age; this.sex = sex; switch (national) { case "Chinese": this.spe...
  • 一、简单工厂模式简单工厂模式属于类的创建型模式,又叫静态工厂方法模式。通过专门定义一个工厂类来负责创建其他类的实例,被创建的实例通常都具有共同的父类。举例说明:现在有个工厂,可以生产自行车和摩托车,...
  • 简单工厂模式又称为静态工厂方法,由一个工厂对象决定创建某一种产品对象类的实例,主要用来创建同一类的对象。其实,工厂模式的思想主要是将相同/相似的的对象或类进行提取归类,这样的话,就可以避免写太多重复性...
  • JS工厂模式介绍

    千次阅读 2015-07-21 23:47:02
     工厂方法模式(Factory method pattern)是一种实现“工厂”概念的面上对象设计模式。实质是定义一个创建对象的接口,但是让实现这个接口的类来决定实例化哪个类。工厂方法让类的实例化推迟到子类中进行。  创建...
  • js 工厂模式简要介绍

    2017-09-08 12:03:00
    什么是工厂模式?就好比一个工厂,能造汽车、飞机...,通过对外接口,由顾客决定,来定制哪一款产品。 在js内表现为,一个工厂函数/对象,包含汽车、飞机等子类,提供对外接口,根据参数返回不同子类的实例 简单实例...
  • JS工厂模式的例子

    2019-11-19 10:05:30
    class Person{ constructor(name,age){ this.name = name; this.age = age; } eat(){ console.log(`I am ${this.name} eat `) } speak(){ console.log(`My name is ${this.name} age is $...JS工厂模式例子
  • 1、工厂模式 主要好处就是可以消除对象间的耦合,通过使用工程方法而不是new关键字。将所有实例化的代码集中在一个位置防止代码重复。 工厂模式解决了重复实例化的问题 ,但还有一个问题,那就是识别问题,因为根本...
  • 工厂模式 考虑到由于ECMAScript中无法创建类,所以用函数来封装以特定接口创建对象的细节。例子代码如下 function createPerson(name, age, job){ var o = new Object(); o.name = name; o.age = age; o.
  • 工厂模式定义 工厂模式是我们最常用的实例化对象模式了,是用工厂方法代替new操作的一种模式,工厂模式就相当于创建实例对象的new 工厂模式的UML类图 上面的Creatot类就相当于工厂,Product相当于工厂中的产品 ...
  • 工厂模式: function factory(name,age,content){ var obj = new Object(); obj.name = name; obj.age = age; obj.content = content; return obj; } var factorySon = factory('二狗子','22'...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,724
精华内容 689
关键字:

js工厂模式