基於JavaScript實現繼承機制之建構函式+原型鏈混合方式的使用詳解

建構函式、原型實現繼承的缺陷

首先來分析建構函式和原型鏈兩種實現繼承方式的缺陷：

建構函式（對象冒充）的主要問題是必須使用建構函式方式，且無法繼承通過原型定義的方法，這不是最好的選擇。不過如果使用原型鏈，就無法使用帶參數的建構函式了。開發人員如何選擇呢？答案很簡單，兩者都用。

建構函式+原型混合方式

這種繼承方式使用建構函式定義類，並非使用任何原型。建立類的最好方式是用建構函式定義屬性，用原型定義方法。這種方式同樣適用於繼承機制，用對象冒充繼承建構函式的屬性，用原型鏈繼承 prototype 對象的方法。用這兩種方式重寫前面的例子，代碼如下：

複製代碼 代碼如下:function ClassA(sColor) {
this.color = sColor;
}

ClassA.prototype.sayColor = function () {
alert(this.color);
};

function ClassB(sColor, sName) {
ClassA.call(this, sColor);
this.name = sName;
}

ClassB.prototype = new ClassA();

ClassB.prototype.sayName = function () {
alert(this.name);
};

在此例子中，繼承機制由兩行反白的藍色代碼實現。在第一行反白的代碼中，在 ClassB 建構函式中，用對象冒充繼承 ClassA 類的 sColor 屬性。在第二行反白的代碼中，用原型鏈繼承 ClassA 類的方法。由於這種混合方式使用了原型鏈，所以 instanceof 運算子仍能正確運行。

下面的例子測試了這段代碼：
複製代碼 代碼如下:var objA = new ClassA("blue");
var objB = new ClassB("red", "John");
objA.sayColor(); //輸出 "blue"
objB.sayColor(); //輸出 "red"
objB.sayName(); //輸出 "John"