Javascript面向對象程式設計--組合繼承

參考書籍：JavaScript設計模式

類式繼承

https://blog.csdn.net/weixin_44924173/article/details/90911544

構造函數繼承

https://blog.csdn.net/weixin_44924173/article/details/91040014

在前面學習到的類式繼承和構造函數繼承，總結這兩種繼承的特點。

類式繼承是基于原型，通過把父類的執行個體化指派給子類的原型，

SubClass.prototype = new SuperClass();

。構造函數繼承是通過在子類的構造函數中執行一次父類的構造函數，

function SubClass(id) {
    SuperClass.call(this, id);//this指向SubClass,下一步去父類，在父類中的this也是指向SubClass
};
           

而組合繼承便是把類式繼承和構造函數組合在一起，融合了它們的優點，并且過濾掉它們的缺點。如：

//聲明父類
function SuperClass(id) {
    //引用類型的公有屬性
    this.books = ['javascript', 'html'];
    //父類公有屬性
    this.id = id;
};
//為父類添加公有方法
SuperClass.prototype.showBooks = function () {
    console.log(this.books);
    console.log(this.id);
};
//聲明子類
function SubClass(id, time) {
    //構造函數繼承父類id屬性
    SuperClass.call(this, id);//this指向SubClass,下一步去父類，在父類中的this也是指向SubClass
    //子類中新增的公有屬性
    this.time = time;
};
//類式繼承：子類原型繼承父類
SubClass.prototype = new SuperClass();
//子類原型方法
SubClass.prototype.getTime = function () {
    console.log(this.time);
}
function displayBook() {
    var sub1 = new SubClass(1,2019);
    console.log('sub1 super value: ' + sub1.books);//sub1 super value: java,html
    var sub2 = new SubClass(2,2018);
    sub2.books.push('css');
    console.log('sub1 super value: ' + sub1.books);//sub1 super value: java,html
    console.log('sub2 super value: ' + sub2.books);//sub2 super value: java,html,css
    sub1.showBooks();//["javascript", "html"]  1
    sub1.getTime();//2019
}
           

這樣在子類的一個執行個體中更改了從父類繼承過來的引用類型，如books，不會影響到其他子類，而且在子類執行個體化過程中可以将參數傳遞到父類的構造函數中，如id.

但是組合繼承并不是完美的，在這個過程中，父類的構造函數被調用了2此，一次是實作子類原型的類式繼承調用一次父類的構造函數，另一次是使用構造函數繼承是被調用。