javascript借用構造函數的示例分析

這篇文章主要介紹了javascript借用構造函數的示例分析，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

借用構造函數

為了解決原型中包含引用類型值所帶來問題，開發人員開始使用一種叫做借用構造函數(constructor stealing)的技術。

有時候也叫偽造對象或者經典繼承。

這種技術的基本思想非常簡單，即在子類型構造函數內部調用超類型構造函數。

函數只不過是在特定環境中的執行代碼的對象，因此通過使用apply()和call()方法也可以在新創造的對象上執行構造函數。

function SuperType() {
    this.colors = ["red","blue","green"];
}

function SubType() {
    //繼承了SuperType
    SuperType.call(this);
}

var instance1 = new SubType();

instance1.colors.push("black");
console.log(instance1.colors); //["red","blue","green","black"]

var instance2 = new SubType();
console.log(instance2.colors); //["red","blue","green"]

注意，這一段代碼“借調”了超類型的構造函數。

function SubType() {
    //繼承了SuperType
    SuperType.call(this);
}

通過使用call()方法（或apply()方法也可以），實際上是在將要創建的SubType實例對象的環境下調用了SuperType構造函數。

這樣一來，就會在新SubType對象上，執行SuperType()函數中定義的所有對象初始化代碼。

所以，SubType的每個實例對象都有具有自己的colors屬性的副本了

傳遞參數

相對于原型鏈而言，借用構造函數有一個很大的優勢，就是可以在子類型構造函數中向超類型構造函數傳遞參數。

function SuperType(name) {
    this.name = name;
}

function SubType(){
    //繼承了SuperType，同時還傳遞了參數
    SuperType.call(this, "Shaw");

    //實例屬性
    this.age = 18;
}

var instance = new SubType();

console.log(instance.name); // "Shaw"
console.log(instance.age); // 18

以上代碼中的SuperType只接受一個參數name，該參數會直接賦值給一個屬性。

在SubType構造函數內部調用SuperType構造函數時，實際上是為SubType的實例對象設置了name屬性（this的指向，跟執行上下文有關）。

為了確保SuperType構造函數不會重寫子類型的屬性，可以在調用超類型的構造函數后，再添加應該在子類型中定義的屬性。

借用構造函數的問題

如果僅僅是借用構造函數，那么也將無法避免構造函數模式存在的問題。

方法都在構造函數中定義，函數的復用就無從說起了，每實例化一個對象，實質上都在每個實例對象上重新創建了一遍方法， 造成內存和資源的浪費。

而且，在超類型的原型中定義的方法，對子類型而言也是不可見的（因為這里沒用原型對象，實際上子類型的原型鏈指向了Object）， 結果所有類型都只能使用構造函數模式。

感謝你能夠認真閱讀完這篇文章，希望小編分享的“javascript借用構造函數的示例分析”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，更多相關知識等著你來學習!