簡單談談javascript程式碼復用模式_javascript技巧

程式碼重複使用有一個著名的原則，是GoF提出的：優先使用物件組合，而不是類別繼承。在javascript中，並沒有類別的概念，所以程式碼的複用，也不限於類別式繼承。 javascript中創建對象的方法很多，有建構函數，可以使用new創建對象，並且可以動態的修改對象。 javascript的非類別繼承（可稱為現代繼承模式）複用方法也很多，例如，利用其它對象組合成所需的對象，對象混入技術，借用和復用所需的方法。

類別繼承模式-預設模式

兩個建構子Parent和Child的例子：

複製程式碼 程式碼如下:

function Parent(name){
this.name = name||"Adam";
}
Parent.prototype.say = {
return this.name;
};
function Child(name){
}
inherit(Child,Parent);

以下是可重複使用繼承函數inherit()的實作方法：

複製程式碼 程式碼如下:

function inherit(C,P){
C.prototype = new P();
}

這裡原型屬性應該指向一個對象，而不是一個函數，因此他必須指向一個由父構造函數所建立的實例，而不是指向建構函數本身。

在這之後，創建Child物件時，會透過原型從Parent實例獲得他的功能：

複製程式碼 程式碼如下:

var kid =new Child();
kid.say();//"Adam"

呼叫繼承之後的原型鏈：

進一步加入kid的屬性：

複製程式碼 程式碼如下:

var kid = new Child();
kid.name = "Patrick";
kid.say();//"Patrick"

原型鏈的變化情況：

可以在自己物件屬性裡面找到name,就不用再去找原型鏈了。

使用上述模式的缺點，其中一個缺點是同時繼承了兩個物件的屬性，即加入this的屬性及原型屬性。大多數時候，不需要自身的這些屬性。

另外一個缺點，使用inherit()繼承不支援將參數傳遞給子建構子中，例如：

複製程式碼 程式碼如下:

var s = new Child("Seth");
s.say();//"Adam"

這個結果並不是期望的，雖然子構造函數可以將參數傳遞到父構造函數中，但是這樣每次需要一個子對象時，都必須重新執行這種繼承機制，而且效率低下，原因是最終會重新建立父對象。

本文就先到這裡了，後續我們將持續更新javascript程式碼重複使用模式的其餘幾種模式。