美文网首页学习笔记
构造函数模式与new

构造函数模式与new

作者: 小小罗同学 | 来源:发表于2018-03-23 22:51 被阅读0次

    工厂模式

    在JS高程中提到有工厂模式的这一设计模式,可批量化,用于解决创建多个相似对象的问题。其实质依然是用一种函数返回对象。例如,我们来造一堆小猫。

    function createCat(name, color){
            var o = Object();
            o.name = name;
            o.color = color;
            return o; 
    }
    var cat1 = createCat("小白","white"); 
    var cat2 = createCat("小黑", "black");
    

    构造函数模式与new

    为了让我们的猫更丰富一点,此时可以使用构造函数模式,并且使用new关键字进行优化。

    function Cat(name,color){
      this.name = name
      this.color = color
    }
    Cat.prototype = {
      legs: 4,
      tails: 1,
      eyes: 2,
      say: function(){
        console.log('miao miao')
        }
    }
    var cat = new Cat('小灰','灰色')
    

    此时,可以两两比较发现,new就是一种语法糖,new帮忙做了四件事
    -帮你创建了临时对象,this指向Cat{}
    -帮你绑定了原型
    -帮你return
    -并统一把原型用prototype

    其中应该注意的是:
    1.在构造函数中,不要乱加return,否则会手写的return出去;
    2.当不使用new时,却return this时,cat === window //true


    image

    3.使用new时,this intanceof Cat //true
    4.当什么也不操作时,new也会增加constructor属性

    p.s. jQure也是一种构造函数,已经帮我们自动添加new了


    image

    相关文章

      网友评论

        本文标题:构造函数模式与new

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