JavaScript 原型(prototype)

原型是一種特殊的概念,透過這個概念,你可以在 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 應用程式開發。

沒有留言: