构造函数

构造函数:通过new操作符调用的函数就是构造函数

创建对象的三种方式:

1:变量直接量(JSON格式key:value)

var obj1={
        name:'xxx',
        age:'xxx',
        sad:function(){}
    }

2:通过new Object()方式

var obj2=new Object();
    obj2.name='xxx';
    obj2.age=20;
    obj2.say=function(){}

3:通过构造函数的方式,优点:可以当做模板

//构造函数Person(),默认return this
    function Person(){
        this.name='xxxx';
        this.age=10;
        this.sad=function(){console.log(this.age)}
        this.speak=function(){
            console.log('I am '+this.name+' '+'今年 :'+this.age);
        }
    }
    var person1=new Person();
    person1.age=20;
    person1.sad();//20
    //注意 new操作符 :的内部原理
        1:创建一个空对象
        2:把this指向到这个空对象
        3:把空对象的内部原型(proto)指向构造函数的原型(prototype)对象
        4:当前构造函数执行完成后,如果没有return的话,就会把当前的空对象返回,一般都没有return
    //注意 new操作符原理:执行的时候类似在构造函数Person()内部,过程可以如下去理解,实际不是!!
    function Person(){
        var tt={};
        this=tt;
        tt.__proto__=Person.prototype;
        this.name='xxxx';
        this.age=10;
        this.sad=function(){...}
        return tt;
    }
    //prototype只有函数才有的原型
    //__proto__所有的对象都有的
    person1.__proto__===Person.prototype;//true
    person1.prototype===Person.prototype;//false
    person1===person2//false

    var person2=new Person();
    //可以把所有实例对象person1、person2...的公用方法封装到构造函数的的原型里面去,就可以减少空间,所以可以优化
    Person.prototype.speak=function(){
        console.log('I am '+this.name+' '+'今年 :'+this.age);
    }
    person2.name='person2';
    person2.age=100;
    person2.sad();//100
    person2.speak();//I am person2 今年 :100

 

 3.1上面的升级版本

function Person(name,age){
        this.name=name;
        this.age=age;
    }
    //1 实例对象person1和person2的公用方法 speak
   Person.prototype.said=function(){
        console.log('This is '+this.name);
    }
    Person.prototype.speak=function(){
       console.log('I am '+this.name+',今年 '+this.age);
    }
    var person1=new Person({name:'马云',age:40});
    var person2=new Person({name:'王健林',age:50});
    person1.said();//This is 马云
    person2.said();//This is 王健林
    person1.speak();//I am 马云,今年 40
    person2.speak();//I am 王健林,今年 50

 

3.2 上面的再升级版本

function Person(option){
        this.name=option.name;
        this.age=option.age;
    }
    Person.prototype.said=function(){
        console.log('This is '+this.name);
    }
    Person.prototype.speak=function(){
       console.log('I am '+this.name+',今年 '+this.age);
    }
    var person1=new Person({name:'马云',age:40});
    var person2=new Person({name:'王健林',age:50});
    person1.said();//This is 马云
    person2.said();//This is 王健林
    person1.speak();//I am 马云,今年 40
    person2.speak();//I am 王健林,今年 50

 

 3.3 还可以再次升级

function Person(option){
        this.init(option);
    }
       //重新设定原型
    Person.prototype={
        init:function(option){
            this.name=option.name||'';
            this.age=option.age||'';
        },
        said:function(){console.log('This is '+this.name);},
        speak:function(){
            console.log('I am '+this.name+',今年 '+this.age);
        }
    }
    var person1=new Person({name:'马云',age:40});
    var person2=new Person({name:'王健林',age:50});
    person1.said();//This is 马云
    person2.said();//This is 王健林
    person1.speak();//I am 马云,今年 40
    person2.speak();//I am 王健林,今年 50

总结:由于实例对象的内部原型proto都指向构造函数的原型prototype,所有的实例对象的方法封装到构造函数的原型里面去

posted @ 2017-01-15 16:45  逗伴不是瓣  阅读(477)  评论(0编辑  收藏  举报