美文网首页
2018-11-27

2018-11-27

作者: kathyever | 来源:发表于2018-11-27 14:20 被阅读0次

    6.2.4 组合使用构造函数模式和原型模式

    构造函数模式用于定义实例属性,而原型模式用于定义方法和共享的属性。
    每个实例都会有自己的一份实例属性的副本,但同时又共享者对方法的引用,最大限度的节省了内存。这种混成模式支持向构造函数传递参数

    function Person(name,age,job){
        this.name = name;
        this.age = age;
        this.job = job;
        this.friends= ["Rainbow","Payne"];
    }
    Person.prototype = {
        constructor:Person,
        sayName:function(){
            alert(this.name);
        }
    }
    
    var person1 = new Person("kathy",18,"student");
    var person2 = new Person("stephen",19,"teacher");
    
    person1.friends.push('Van');
    alert(person1.friends);//Rainbow,Payne,Van
    alert(person2.friends);//Rainbow,Payne
    alert(person1.friends === person2.friends);//false
    alert(person1.sayName === person2.sayName);//true
    
    

    在这个例子中,实例属性都是在构造函数中定义的。所有实例共享的属性constructor和方法sayName()则是在原型中定义的。
    修改person1并不会影响到person2,因为他们分别引用了不同的数组。


    动态原型模式

    动态原型模式是把所有信息都封装在构造函数中,再通过在构造函数中初始化原型,保持同时使用构造函数和原型的特点。
    可以通过检查某个应该存在的方法是否有效来决定是否需要初始化原型:

    function Person(name,age,job){
        //属性
        this.name=name;
        this.age=age;
        this.job=job;
    
        //  方法
        if(typeof this.sayName != "function"){
            Person.prototype.sayName = function(){
                alert(this.name);
            };
        }
    }
    var friend  = new Person("kahty",18,"student");
    friend.sayName();
    

    上面代码中的if()只有在sayName()方法不存在的情况下,才会添加到原型中,而且只会在初次调用函数时才会执行。
    if语句检查的可以是初始化之后应该存在的任何属性或方法

    6.2.6

    function Person(name,age,job){
        //属性
        this.name=name;
        this.age=age;
        this.job=job;
    
        //方法
        if(typeof this.sayName != "function"){
              Person.prototype.sayName=function(){
                alert(this.name);
            };
         }
    }
    var friend =new Person("kathy",18,"student");
    friend.sayName();//kathy
    

    上面的例子中,Person函数创建了一个新对象,以相应的属性和方法初始化该对象,然后返回这个对象。
    构造函数在不返回值的情况下,默认会返回新对象实例。

    相关文章

      网友评论

          本文标题:2018-11-27

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