Es5 對象和原型鏈實現混合繼承
方法的區(qū)別
在構造函數和原型鏈添加方法區(qū)別:
Object.prototype.test=function(){
alert('我是原型鏈上 test()');
}
function Person(){
this.name='張三';
this.age=20;
function test(){
alert('我是Person上 test()')
}
}
function Son(){
}
var p=new Son()
p.test();
// 打印的是原型鏈上 test()
結論: 原型鏈上的方法會被多個實例 共享浓领,構造函數不會
靜態(tài)方法:
function static(){
}
static.add=function(){
alert('靜態(tài)方法')
}
E5的繼承
原理: 原型鏈+對象冒充的組合繼承模式
對象冒充實現繼承
function Father(){
}
function Son(){
}function Father(){
this.name='張三';
this.age=20;
this.test =function(){
alert('我是Father')
}
}
function Son(){
Father.call(this); // 通過改變 this 指向 對象冒充繼承
}
var w=new Son();
w.test();
總結: 對象冒充可以繼承構造的數里面的屬性和方法 但是無法繼承原型鏈上的屬性和方法
原型鏈實現繼承
function Father(name,age){
this.name='張三';
this.age=20;
this.test =function(){
alert('我是Father')
}
}
function Son(){
Father.call(this); // 通過改變 this 指向 對象冒充繼承
}
Father.prototype.wx=function(){
alert('原型鏈上的方法')
}
Father.prototype.sex='男'
Son.prototype=new Father()
var w=new Son();
w.wx();
**總結** 原型鏈實現繼承:可以繼示構造數里面的屬性和方法也可以繼承原型鏈上面的屬性和方法 但是實例化子類時沒辦法給父類傳參
優(yōu)化
function Father(name, age) {
this.name = name;
this.age = age;
this.test = function () {
alert(`我叫${name} 今年${age}`)
}
}
function Son(name,age) {
Father.call(this, name, age); // 通過改變 this 指向 對象冒充繼承
}
Father.prototype.wx = function () {
alert('原型鏈上的方法')
}
Father.prototype.sex = '男'
Son.prototype = new Father()
var w = new Son('李白',20);
w.test()