美文网首页
简述JS的工厂模式

简述JS的工厂模式

作者: 谢环志 | 来源:发表于2017-10-28 10:47 被阅读0次
    var 码农={
          ID:1,
          具备技能:[java,javascript,php,html,css ],
          初始头发数:n,
          写代码:function(){/*搬砖中,n=n-1*/},
          修电脑:function(){/*强行修电脑*/},
    };
    AI.制造码农(码农);
    

    以上是我打算制造一个机器人码农,那么它在计算机里面的大概状态就是这个样子,包含的属性包括:ID,具备技能,初始头发数,写代码(行为),修电脑(行为)。
    如果我要制造100个前端的码农呢?那么比较粗糙的方法如下:

    var 码农们=[],码农;
    for(var i=0;i<100;i++){
         码农={
          ID:i,
          具备技能:[javascript,html,css ],
          初始头发数:n,
          写代码:function(){/*搬砖中,n=n-1*/},
          修电脑:function(){/*强行修电脑*/},
    }
    码农们.push(码农);
    };
    AI.批量制造(码农们);
    

    上面这种写法会产生一个很大的问题:每制造一个码农,[写代码]和[修电脑]这两个函数就会运行一次,制造一百个就要运行一百次,两个函数就需要内存开辟两百次。因为这两种行为对于这一百个码农都是一样的,那么可以把这两个行为各自引用一个函数就可以了,没必要重复一百次。[具备技能]这一栏因为我们需要的是前端码农,所以也是技能一样的,不需要创建一百次。这样就会大大减少内存的占有。
    那么对于多个对象具有一些相同属性的时候,比较有效的方式是把相同的部分放到对象的prototype里面。代码如下:

    var 前端码农原型={
          具备技能:[javascript,html,css ],
          写代码:function(){/*搬砖中,n=n-1*/},
          修电脑:function(){/*强行修电脑*/},
    }
    var 码农们=[],码农;
    for(var i=0;i<100;i++){
    码农={
    ID=i,
    初始头发数=n
    }
    码农.__proto__ =前端码农原型;
    码农们.push(码农);
    }
    AI.批量制造(码农们);
    
    

    对上面代码进行一下优化:

    var 前端码农原型={
          具备技能:[javascript,html,css ],
          写代码:function(){/*搬砖中,n=n-1*/},
          修电脑:function(){/*强行修电脑*/},
    }
    function 码农(ID){
         var 临时对象={};
         临时对象.__proto__ =前端码农原型;
         临时对象.ID=ID;
         临时对象.n=n;
        return 临时对象;
    }
    
    //然后对以上代码进行封装后,就可以随时随地制造需要的AI码农了:
    
    var 码农们=[],码农;
     for(var i=0;i<需要的数量;i++){
         码农们.push(码农(i));
    }
    AI.批量制造(码农们);
    

    上面封装起来的这个方法,就是所谓的工厂模式(Factory Pattern)。它的主要作用就是解决创建多个相似对象过程中简化实现的过程,同时也可以减少每种对象所需的代码量以及内存占用。
    简单来说:工厂模式就是一个函数里面返回一个对象,作用就是批量生产,效果就是减少代码和内存。
    虽然工厂模式的优点很突出,但根据《JavaScript 高级程序设计》144页的描述:“却没有解决对象识别的问题”。这句话是什么意思作为js小白的我还是一脸懵逼的,但“构造函数模式”貌似解决了这个问题。
    构造函数模式即在代码里加个”new“。至于new的原理和new与工厂模式之间的差异,回头我再研究研究,敬请期待。

    相关文章

      网友评论

          本文标题:简述JS的工厂模式

          本文链接:https://www.haomeiwen.com/subject/ybbjpxtx.html