- 構(gòu)造函數(shù)显押、原型和實例的關(guān)系:
每個構(gòu)造函數(shù)都有其對應(yīng)的原型對象浸踩;
每個原型對象都有一個構(gòu)造函數(shù)指針constructor指向其構(gòu)造函數(shù)叔汁;
每個實例都包含一個內(nèi)部指針[[prototype]],指向構(gòu)造函數(shù)的原型對象检碗;
我們創(chuàng)建一個Person構(gòu)造函數(shù)和一個Student構(gòu)造函數(shù)攻柠,如下:
function Person(){
this.name = "張三",
this.hobby=["游泳","看書"]
}
Person.prototype.sayName=function(){return this.name}
function Student(){
this.needStudy = true
}
Student.prototype.getStudy=function(){return this.needStudy}
Person構(gòu)造函數(shù)的原型屬性有sayName,實例屬性有name和hobby。Student的原型屬性有g(shù)etStudy后裸,實例屬性有needStudy。
用結(jié)構(gòu)圖展示構(gòu)造函數(shù)冒滩、原型對象和實例的關(guān)系如下:
繼承的實現(xiàn)
下面講述3種繼承的實現(xiàn)方法:
原型鏈繼承微驶、借用構(gòu)造函數(shù)繼承、組合繼承开睡。
1.原型鏈繼承
讓Student繼承Person的實現(xiàn):
令Student的原型對象等于Person的實例因苹。
Student.prototype = new Person()
//Student原型上的方法需要重新定義以下,因為上面重寫了Student原型對象
Student.prototype.getStudy=function(){return this.needStudy}
var stu1 = new Student()
其結(jié)構(gòu)圖如下:
原型鏈實現(xiàn)繼承的本質(zhì):重寫原型對象篇恒。
- 注意:子類型中定義與超類型同樣的方法名會覆蓋超類型中的方法扶檐。
如下:
Student.prototype.sayName=function(){return "李四"}
var stu1 = new Student()
stu1.sayName() //"李四"
- 原型鏈的問題:
1.超類型上定義的實例屬性會相互影響,如下:
function Person(){
this.name = "張三",
this.hobby=["游泳","看書"]
}
function Student(){
}
Student.prototype = new Person()
var stu1=new Student()
var stu2=new Student()
stu1.hobby.push("聽歌")
console.log(stu1.hobby, stu2.hobby)
上述對stu1的hobby的改變會影響到stu2的hobby值胁艰。
2.無法向超類型傳遞參數(shù)
function Person(name, hobby){
this.name = name,
this.hobby = hobby
}
function Student(){
}
Student.prototype = new Person("張三",["游泳"])
var stu1=new Student()
var stu2=new Student()
如果想在new Student()的時候傳遞參數(shù)給Person款筑,是無法傳遞的智蝠。
為解決以上問題,可以使用借用構(gòu)造函數(shù)方法奈梳。
2.借用構(gòu)造函數(shù)繼承
function Person(name,hobby){
this.name = name,
this.hobby=hobby
}
Person.prototype.sayName=function(){return this.name}
function Student(name,hobby){
this.needStudy = true
Person.call(this,name,hobby)
}
var stu1 = new Student("張三",["看書"])
var stu2 = new Student("李四",["聽歌"])
將超類型中的方法和屬性在子類型中定義一遍杈湾。
- 借用構(gòu)造函數(shù)的問題:
方法都在構(gòu)造函數(shù)中定義,函數(shù)無法實現(xiàn)復(fù)用攘须;
超類型中的原型方法無法訪問到漆撞。
3.組合繼承
function Person(name,hobby){
this.name = name,
this.hobby=hobby
}
Person.prototype.sayName=function(){return this.name}
function Student(name,hobby){
this.needStudy = true
Person.call(this,name,hobby)
}
Student.prototype = new Person();
Student.prototype.constructor = Student
Student.prototype.getStudy=function(){
return this.needStudy
}
var stu1 = new Student("張三",["看書"])
var stu2 = new Student("李四",["聽歌"])
- 組合繼承本質(zhì):
原型鏈繼承共享的屬性和方法,借用構(gòu)造函數(shù)繼承實例屬性于宙。