JavaScript 原型(prototype)

2013-03-14

1633
0

摘要:JavaScript 原型(prototype)

原文出處：http://www.kangting.tw/2013/03/javascript-prototype.html

原型是一種特殊的概念，透過這個概念，你可以在 JavaScript 運用繼承技巧建立新的物件，而這也是物件導向語言最重要的機制。

JavaScript 讓每個物件均繼承至一個特定的物件，此物件稱為原型物件，透過 prototype屬性的引用即可取得此物件。例如有一個物件 o ，透過語法 o.prototype 取可取得 o 的原型物件，考慮以下這一行程式碼：

var op = o.prototype ;

其中的 op 即參照了 o 的原型物件。物件本身會同時具備原型物件的特性，因此你可以將共用的功能封裝成一個公用物件，然後將新建立的物件原型設定為此物件，如此一來新建立的物件不需撰寫任何程式碼，即可擁有需要的基礎功能。考慮以下的程式片段：

o.prototype = op ;

其中的 o 為一物件，同時具有 op 的功能。考慮以下的程式片段：

var op1 = { 'sayHello': 'HELLO Prototype !' };

function o1() { }; //空物件

o1.prototype = op1;　//讓 o1 具有 op1 的功能

function hello() {

var h1 = new o1(); //建立一個新的 o1 物件

console.log(h1.sayHello); //透過 o1 引用 op1 的屬性

}

其中的 o1 是一個空函式，當其 prototype 設定為 op1 ，則 op1 的功能亦會傳遞至 o1 ，如此一來即可直接透過 o1 物件來引用其 sayHello 屬性。要測試這段程式碼，只要呼叫 hello() 函式即可，它會在主控台輸出「HELLO Prototype !」訊息字串。

對一名熟悉物件導向語言（例如 Java）的程式設計師而言，上述的 prototype 運用即為 JavaScript 繼承機制最重要的基礎，而透過一些技巧的運用，我們甚至能夠運用 prototype 以典型的物件導向類別設計模式進行 JavaScript 應用程式開發。

原文出處：http://www.kangting.tw/2013/03/javascript-prototype.html

回首頁