JavaScript中對(duì)象的prototype屬性，可以返回對(duì)象類型原型的引用。這是一個(gè)相當(dāng)拗口的解釋，要理解它，先要正確理解對(duì)象類型(Type)以及原型(prototype)的概念。
1 什么是prototype
JavaScript中對(duì)象的prototype屬性，可以返回對(duì)象類型原型的引用。這是一個(gè)相當(dāng)拗口的解釋，要理解它，先要正確理解對(duì)象類型(Type)以及原型(prototype)的概念。
前面我們說，對(duì)象的類（Class）和對(duì)象實(shí)例（Instance）之間是一種“創(chuàng)建”關(guān)系，因此我們把“類”看作是對(duì)象特征的模型化，而對(duì)象看作是類特征的具體化，或者說，類(Class)是對(duì)象的一個(gè)類型(Type)。例如，在前面的例子中，p1和p2的類型都是Point，在JavaScript中，通過instanceof運(yùn)算符可以驗(yàn)證這一點(diǎn)：
p1 instanceof Point
p2 instanceof Point
但是，Point不是p1和p2的唯一類型，因?yàn)閜1和p2都是對(duì)象，所以O(shè)bejct也是它們的類型，因?yàn)镺bject是比Point更加泛化的類，所以我們說，Obejct和Point之間有一種衍生關(guān)系，在后面我們會(huì)知道，這種關(guān)系被叫做“繼承”，它也是對(duì)象之間泛化關(guān)系的一個(gè)特例，是面向?qū)ο笾胁豢扇鄙俚囊环N基本關(guān)系。
在面向?qū)ο箢I(lǐng)域里，實(shí)例與類型不是唯一的一對(duì)可描述的抽象關(guān)系，在JavaScript中，另外一種重要的抽象關(guān)系是類型(Type)與原型(prototype)。這種關(guān)系是一種更高層次的抽象關(guān)系，它恰好和類型與實(shí)例的抽象關(guān)系構(gòu)成了一個(gè)三層的鏈。
在現(xiàn)實(shí)生活中，我們常常說，某個(gè)東西是以另一個(gè)東西為原型創(chuàng)作的。這兩個(gè)東西可以是同一個(gè)類型，也可以是不同類型。習(xí)語“依葫蘆畫瓢”，這里的葫蘆就是原型，而瓢就是類型，用JavaScript的prototype來表示就是“瓢.prototype =某個(gè)葫蘆”或者“瓢.prototype= new 葫蘆()”。
要深入理解原型，可以研究關(guān)于它的一種設(shè)計(jì)模式——prototype pattern，這種模式的核心是用原型實(shí)例指定創(chuàng)建對(duì)象的種類，并且通過拷貝這些原型創(chuàng)建新的對(duì)象。JavaScript的prototype就類似于這種方式。
關(guān)于prototype pattern的詳細(xì)內(nèi)容可以參考《設(shè)計(jì)模式》（《Design Patterns》）它不是本文討論的范圍。
注意，同類型與實(shí)例的關(guān)系不同的是，原型與類型的關(guān)系要求一個(gè)類型在一個(gè)時(shí)刻只能有一個(gè)原型（而一個(gè)實(shí)例在一個(gè)時(shí)刻顯然可以有多個(gè)類型）。對(duì)于JavaScript來說，這個(gè)限制有兩層含義，第一是每個(gè)具體的JavaScript類型有且僅有一個(gè)原型（prototype），在默認(rèn)的情況下，這個(gè)原型是一個(gè)Object對(duì)象（注意不是Object類型?。?。第二是，這個(gè)對(duì)象所屬的類型，必須是滿足原型關(guān)系的類型鏈。例如p1所屬的類型是Point和Object，而一個(gè)Object對(duì)象是Point的原型。假如有一個(gè)對(duì)象，它所屬的類型分別為ClassA、ClassB、ClassC和Object，那么必須滿足這四個(gè)類構(gòu)成某種完整的原型鏈。
有意思的是，JavaScript并沒有規(guī)定一個(gè)類型的原型的類型（這又是一段非常拗口的話），因此它可以是任何類型，通常是某種對(duì)象，這樣，對(duì)象-類型-原形（對(duì)象）就可能構(gòu)成一個(gè)環(huán)狀結(jié)構(gòu)，或者其它有意思的拓?fù)浣Y(jié)構(gòu)，這些結(jié)構(gòu)為JavaScript帶來了五花八門的用法，其中的一些用法不但巧妙而且充滿美感。下面的一節(jié)主要介紹prototype的用法。

2 prototype使用技巧
在了解prototype的使用技巧之前，首要先弄明白prototype的特性。首先，JavaScript為每一個(gè)類型(Type)都提供了一個(gè)prototype屬性，將這個(gè)屬性指向一個(gè)對(duì)象，這個(gè)對(duì)象就成為了這個(gè)類型的“原型”，這意味著由這個(gè)類型所創(chuàng)建的所有對(duì)象都具有這個(gè)原型的特性。另外，JavaScript的對(duì)象是動(dòng)態(tài)的，原型也不例外，給prototype增加或者減少屬性，將改變這個(gè)類型的原型，這種改變將直接作用到由這個(gè)原型創(chuàng)建的所有對(duì)象上，例如：

如果給某個(gè)對(duì)象的類型的原型添加了某個(gè)名為a的屬性，而這個(gè)對(duì)象本身又有一個(gè)名為a的同名屬性，則在訪問這個(gè)對(duì)象的屬性a時(shí)，對(duì)象本身的屬性“覆蓋”了原型屬性，但是原型屬性并沒有消失，當(dāng)你用delete運(yùn)算符將對(duì)象本身的屬性a刪除時(shí)，對(duì)象的原型屬性就恢復(fù)了可見性。利用這個(gè)特性，可以為對(duì)象的屬性設(shè)定默認(rèn)值，例如：

上面的例子通過prototype為Point對(duì)象設(shè)定了默認(rèn)值(0,0)，因此p1的值為(0,0)，p2的值為(1,2)，通過delete p2.x, delete p2.y; 可以將p2的值恢復(fù)為(0,0)。下面是一個(gè)更有意思的例子：

利用prototype還可以為對(duì)象的屬性設(shè)置一個(gè)只讀的getter，從而避免它被改寫。下面是一個(gè)例子：

將this.getFirstPoint()改寫為下面這個(gè)樣子：

則可以避免這個(gè)問題，保證了m_firstPoint屬性的只讀性。

實(shí)際上，將一個(gè)對(duì)象設(shè)置為一個(gè)類型的原型，相當(dāng)于通過實(shí)例化這個(gè)類型，為對(duì)象建立只讀副本，在任何時(shí)候?qū)Ω北具M(jìn)行改變，都不會(huì)影響到原始對(duì)象，而對(duì)原始對(duì)象進(jìn)行改變，則會(huì)影響到副本，除非被改變的屬性已經(jīng)被副本自己的同名屬性覆蓋。用delete操作將對(duì)象自己的同名屬性刪除，則可以恢復(fù)原型屬性的可見性。下面再舉一個(gè)例子：

注意，以上的例子說明了用prototype可以快速創(chuàng)建對(duì)象的多個(gè)副本，一般情況下，利用prototype來大量的創(chuàng)建復(fù)雜對(duì)象，要比用其他任何方法來copy對(duì)象快得多。注意到，用一個(gè)對(duì)象為原型，來創(chuàng)建大量的新對(duì)象，這正是prototype pattern的本質(zhì)。
下面是一個(gè)例子：

除了上面所說的這些使用技巧之外，prototype因?yàn)樗?dú)特的特性，還有其它一些用途，被用作最廣泛和最廣為人知的可能是用它來模擬繼承，關(guān)于這一點(diǎn)，留待下一節(jié)中去討論。
3 prototype的實(shí)質(zhì)
上面已經(jīng)說了prototype的作用，現(xiàn)在我們來透過規(guī)律揭示prototype的實(shí)質(zhì)。
我們說，prototype的行為類似于C++中的靜態(tài)域，將一個(gè)屬性添加為prototype的屬性，這個(gè)屬性將被該類型創(chuàng)建的所有實(shí)例所共享，但是這種共享是只讀的。在任何一個(gè)實(shí)例中只能夠用自己的同名屬性覆蓋這個(gè)屬性，而不能夠改變它。換句話說，對(duì)象在讀取某個(gè)屬性時(shí)，總是先檢查自身域的屬性表，如果有這個(gè)屬性，則會(huì)返回這個(gè)屬性，否則就去讀取prototype域，返回protoype域上的屬性。另外，JavaScript允許protoype域引用任何類型的對(duì)象，因此，如果對(duì)protoype域的讀取依然沒有找到這個(gè)屬性，則JavaScript將遞歸地查找prototype域所指向?qū)ο蟮膒rototype域，直到這個(gè)對(duì)象的prototype域?yàn)樗旧砘蛘叱霈F(xiàn)循環(huán)為止，我們可以用下面的圖來描述prototype與對(duì)象實(shí)例之間的關(guān)系：
//TODO:
4 prototype的價(jià)值與局限性
從上面的分析我們理解了prototype，通過它能夠以一個(gè)對(duì)象為原型，安全地創(chuàng)建大量的實(shí)例，這就是prototype的真正含義，也是它的價(jià)值所在。后面我們會(huì)看到，利用prototype的這個(gè)特性，可以用來模擬對(duì)象的繼承，但是要知道，prototype用來模擬繼承盡管也是它的一個(gè)重要價(jià)值，但是絕對(duì)不是它的核心，換句話說，JavaScript之所以支持prototype，絕對(duì)不是僅僅用來實(shí)現(xiàn)它的對(duì)象繼承，即使沒有了prototype繼承，JavaScript的prototype機(jī)制依然是非常有用的。
由于prototype僅僅是以對(duì)象為原型給類型構(gòu)建副本，因此它也具有很大的局限性。首先，它在類型的prototype域上并不是表現(xiàn)為一種值拷貝，而是一種引用拷貝，這帶來了“副作用”。改變某個(gè)原型上引用類型的屬性的屬性值（又是一個(gè)相當(dāng)拗口的解釋:P），將會(huì)徹底影響到這個(gè)類型創(chuàng)建的每一個(gè)實(shí)例。有的時(shí)候這正是我們需要的（比如某一類所有對(duì)象的改變默認(rèn)值），但有的時(shí)候這也是我們所不希望的（比如在類繼承的時(shí)候），下面給出了一個(gè)例子：

JavaScript實(shí)現(xiàn)：
在Java語言中對(duì)象都繼承自java.lang.Object，而java.lang.Object就提供了Clone的方法，只要實(shí)現(xiàn)接口Cloneable，即表示支持Clone，否則拋出異常。在這點(diǎn)JavaScript是非常接近的，所有的對(duì)象都是從Object繼承，不過Object并不支持Clone的方法，但是我們可以通過自己對(duì)于JavaScript通過expanddo的形式實(shí)現(xiàn)Clone方法，這樣日后所有的對(duì)象創(chuàng)建都實(shí)現(xiàn)了Clone方法。
因?yàn)镴avaScript本身沒有提供Clone的方法，同時(shí)對(duì)于對(duì)象的賦值如var a=new Object();var b=a，這樣的代碼a,b是指向同一對(duì)象的，要?jiǎng)?chuàng)建一個(gè)對(duì)象必須通過new這個(gè)關(guān)鍵字來實(shí)現(xiàn)，因此在Clone的實(shí)現(xiàn)過程，我內(nèi)部定義了一個(gè)構(gòu)造子(constructor)CloneModel，同時(shí)指定其父對(duì)象為要進(jìn)行Clone活動(dòng)本身的對(duì)象，因此使用了this關(guān)鍵字，在我們定義的構(gòu)造子CloneModel的基礎(chǔ)上我們創(chuàng)建一個(gè)一個(gè)對(duì)象，因?yàn)闃?gòu)造子內(nèi)部沒有任何代碼，新創(chuàng)建的對(duì)象實(shí)際上說所有的實(shí)現(xiàn)都在父對(duì)象中，也就是我們需要進(jìn)行Clone的對(duì)象。到目前為止，我們已經(jīng)創(chuàng)建了一個(gè)需要復(fù)制的對(duì)象，但是所有的值都是指向父對(duì)象的。
在 JavaScript的面向?qū)ο蠓绞街?，我們?cè)?jīng)討論過，如果沒有覆蓋父對(duì)象的值，那么這個(gè)時(shí)候是直接指向父對(duì)象的，在Prototype Pattern是要求Clone之后的對(duì)象的內(nèi)部值是不應(yīng)該相關(guān)的，而只要賦值一次，objClone的值都會(huì)在自己的內(nèi)存空間里頭，而不是還指向父對(duì)象?；谌绱说目紤]，objClone[v]=objClone[v];語句就是實(shí)現(xiàn)將父對(duì)象的值通過覆蓋的方式拷貝到自己的內(nèi)存來。

21.2.1 什么是 prototype
JavaScript 中對(duì)象的 prototype 屬性，可以返回對(duì)象類型原型的引用。這是一個(gè)相當(dāng)拗口的解釋，要理解它，先要正確理解對(duì)象類型（Type）以及原型（prototype）的概念。 前面我們說，對(duì)象的類（Class）和對(duì)象實(shí)例（Instance）之間是一種“創(chuàng)建”關(guān)系，因此我們把“類”看作是對(duì)象特征的模型化，而對(duì)象看作是類特征的具體化，或者說，類（Class）是對(duì)象的一個(gè)類型（Type）。例如，在前面的例子中，p1 和p2 的類型都是 Point，在 JavaScript 中，通過instanceof運(yùn)算符可以驗(yàn)證這一點(diǎn)： p1 instanceof Point p2 instanceof Point 但是，Point 不是 p1 和 p2 的唯一類型，因?yàn)?p1 和 p2 都是對(duì)象，所以 Obejct 也是它們的類型，因?yàn)镺bject 是比 Point 更加泛化的類，所以我們說，Obejct和 Point之間有一種衍生關(guān)系，在后面我們會(huì)知道，這種關(guān)系被叫做“繼承”，它也是對(duì)象之間泛化關(guān)系的一個(gè)特例，是面向?qū)ο笾胁豢扇鄙俚囊环N基本關(guān)系。 在面向?qū)ο箢I(lǐng)域里，實(shí)例與類型不是唯一的一對(duì)可描述的抽象關(guān)系，在 JavaScript 中，另外一種重要的抽象關(guān)系是類型（Type）與原型（prototype）。這種關(guān)系是一種更高層次的抽象關(guān)系，它恰好和類型與實(shí)例的抽象關(guān)系構(gòu)成了一個(gè)三層的鏈，

圖 21.2 描述了這種關(guān)系：
　　　　　　　　　　　　　　　　　　　　　　　　圖 21.2 對(duì)象、類型與原型的關(guān)系
在現(xiàn)實(shí)生活中，我們常常說，某個(gè)東西是以另一個(gè)東西為原型創(chuàng)作的。這兩個(gè)東西可以是同一個(gè)類型，也可以是不同類型。習(xí)語“照貓畫虎”，這里的貓就是原型，而虎就是類型，用 JavaScript的 prototype 來表示就是“虎.prototype =某只貓”或者“虎.prototype= new 貓()”。 “原型”是描述自然界事物之間“歸類”關(guān)系的一種，另外幾種關(guān)系包括“繼承”和“接口”。一般來說，“繼承”描述的是事物之間固有的衍生關(guān)系，能被“繼承”所描述的事物之間具有很強(qiáng)的關(guān)聯(lián)性（血緣）?！敖涌凇泵枋龅氖鞘挛锕τ梅矫娴墓餐卣?。而“原型”則傾向于描述事物之間的“相似性”。從這一點(diǎn)來看，“原型”在描述事物關(guān)聯(lián)性的方面，比繼承和接口更加廣義。 如果你是 Java 程序員，上面的例子從繼承的角度來考慮，當(dāng)然不可能用“貓”去繼承“虎”，也不可能用“虎”去繼承“貓”，要描述它們的關(guān)系，需要建立一個(gè)涵蓋了它們共性的“抽象類”，或者你會(huì)叫它“貓科動(dòng)物”。可是，如果我的系統(tǒng)中只需要用到“貓”和“老虎”，那么這個(gè)多余的“貓科動(dòng)物”對(duì)于我來說沒有任何意義，我只需要表達(dá)的是，“老虎”有點(diǎn)像“貓”，僅此而已。在這里，用原型幫我們成功地節(jié)省了一個(gè)沒有必要建立的類型“貓科動(dòng)物”。 要深入理解原型，可以研究關(guān)于它的一種設(shè)計(jì)模式——prototype pattern，這種模式的核心是用原型實(shí)例指定創(chuàng)建對(duì)象的種類，并且通過拷貝這些原型創(chuàng)建新的對(duì)象。JavaScript 的 prototype 就類似于這種方式。 關(guān)于 prototype pattern的詳細(xì)內(nèi)容可以參考《設(shè)計(jì)模式》（《Design Patterns》）它不是本書討論的范圍。 注意，原型模式要求一個(gè)類型在一個(gè)時(shí)刻只能有一個(gè)原型（而一個(gè)實(shí)例在一個(gè)時(shí)刻顯然可以有多個(gè)類型）。對(duì)于 JavaScript 來說，這個(gè)限制有兩層含義，第一是每個(gè)具體的 JavaScript 類型有且僅有一個(gè)原型（prototype），在默認(rèn)的情況下，該原型是一個(gè) Object 對(duì)象（注意不是 Object 類型！）。第二是，這個(gè)類型的實(shí)例的所有類型，必須是滿足原型關(guān)系的類型鏈。例如 p1 所屬的類型是 Point 和 Object，而一個(gè) Object對(duì)象是 Point 的原型。假如有一個(gè)對(duì)象，它所屬的類型分別為 ClassA、ClassB、ClassC 和 Object，那么必須滿足這四個(gè)類構(gòu)成某種完整的原型鏈，例如：
例 21.4 原型關(guān)系的類型鏈
function ClassA()
{
……
}
ClassA.prototype = new Object(); //這個(gè)可以省略
function ClassB()
{
……
}
ClassB.prototype = new ClassA(); //ClassB以 ClassA的對(duì)象為原型
function ClassC()
{
　　 ……
}
ClassC.prototype = new ClassB(); //ClassC以 ClassB的對(duì)象為原型
var obj = new ClassC();
alert(obj instanceof ClassC); //true
alert(obj instanceof ClassB); //true
alert(obj instanceof ClassA); //true
alert(obj instanceof Object); //true

圖 21.3 簡單描述了它們之間的關(guān)系：
圖 21.3 原型關(guān)系的類型鏈
有意思的是，JavaScript并沒有規(guī)定一個(gè)類型的原型的類型（這又是一段非常拗口的話），因此它可以是任何類型，通常是某種對(duì)象，這樣，對(duì)象-類型-原形（對(duì)象）就可能構(gòu)成一個(gè)環(huán)狀結(jié)構(gòu)，或者其它有意思的拓?fù)浣Y(jié)構(gòu)，這些結(jié)構(gòu)為 JavaScript 帶來了五花八門的用法，其中的一些用法不但巧妙而且充滿美感。下面的一節(jié)主要介紹 prototype 的用法。 <

最新評(píng)論