JavaScript面向?qū)ο缶幊?繼承（三）

alaege 發(fā)布于2019-08-23 12:04 / 3069人閱讀

摘要：子類不是父類實例的問題是由類式繼承引起的。所以寄生式繼承和構(gòu)造函數(shù)繼承的組合又稱為一種新的繼承方式。但是這里的寄生式繼承處理的不是對象，而是類的原型?？瓷先ヂ晕碗s，還得好好研究。

寄生組合式繼承（終極繼承者）

前面學習了類式繼承和構(gòu)造函數(shù)繼承組合使用，也就是組合繼承，但是這種繼承方式有個問題，就是子類不是父類的實例，而子類的原型是父類的實例。子類不是父類實例的問題是由類式繼承引起的。因此還有一種更好的繼承方式，那就是寄生組合式繼承，也就是寄生式繼承和構(gòu)造函數(shù)繼承的組合，因為寄生式繼承依托于原型繼承，原型繼承又與類式繼承相像。所以寄生式繼承和構(gòu)造函數(shù)繼承的組合又稱為一種新的繼承方式。但是這里的寄生式繼承處理的不是對象，而是類的原型。

/**
 *寄生式繼承 繼承原型
 * 傳遞參數(shù) subClass子類
 * 傳遞參數(shù) superClass 父類
 */
function inheritPrototype(subClass,superClass) {
    //復制一份父類的原型副本保存在變量中
    var p = inheritObject(superClass.prototype);
    //修正因為重寫子類原型副本保存在變量中
    p.constructor = subClass;
    //設(shè)置子類的原型
    subClass.prototype = p;
}
//測試代碼
//定義父類
function SuperClass(name) {
    this.name = name;
    this.colors =["red","blue","green"];
}
//定義父類原型方法
SuperClass.prototype.getName = function () {
    console.log(this.name);
};
//定義子類
function SubClass(name,time) {
    //構(gòu)造函數(shù)式繼承
    SuperClass.call(this,name);
    //子類新增屬性
    this.time = time;
}
//寄生式繼承父類原型
inheritPrototype(SubClass,SuperClass);
//子類新增原型方法
SubClass.prototype.getTime = function () {
    console.log(this.time);
};
//創(chuàng)建兩個測試方法
var instance1 = new SubClass("js",2018);
var instance2 = new SubClass("css",8102);
instance1.colors.push("black");
console.log(instance1.colors);//[ "red", "blue", "green", "black" ]
console.log(instance2.colors);//[ "red", "blue", "green" ]
instance2.getName();//css
instance2.getTime();//8102

寄生組合式繼承主要是通過寄生式繼承重新繼承父類的原型，需要繼承的僅僅是父類的原型，而不需要再調(diào)用父類的構(gòu)造函數(shù)，也就是說在構(gòu)造函數(shù)繼承中我們已經(jīng)調(diào)用了父類的構(gòu)造函數(shù)，因此我們需要的就是父類的原型對象的一個副本，而這個副本通過原型繼承即可得到，但是直接賦值給子類會有問題，因為對父類原型對象復制得到的復制對象p中的constructor指向的不是subClass子類對象，因此在寄生式繼承中要對復制對象p做一次增強，修復其constructor屬性指向不正確的問題，最后將得到的復制對象p賦值給子類的原型，這樣子類的原型就繼承了父類的原型并且沒有執(zhí)行父類的構(gòu)造函數(shù)。
看上去略微復雜，還得好好研究。