构造函数:通过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,所有的实例对象的方法封装到构造函数的原型里面去