對javascript prototype的一點初步理解

項目組由印度高端引入了一個腳本框架。當中用到了prototype來實現一些功能。
今天找了幾篇關於javascript的prototype的文章讀了下，有了點初步的理解，而後在紙上畫了個關係圖歸納了一下本身的理解，最後發現和[1]文最後的附圖不謀而合。

來看看[1]文最後的附圖：

聽說這圖來自ECMA Script的標準。

我的對這圖的一些理解，CF就是function的定義（能夠類比爲java中的class的定義），當中定義了p1和p2兩個屬性，當中有一個prototype對象（javascript內置定義的對象），指向的CFp是一個對象的實例。注意這裏CF的prototype和CFp的關係是實線的，表明explicit prototype property。

而下面的cf1,cf2 ...則是CF的實例化，每一個實例裏的q1,q2就是CF定義中的p1,p2的實例化。

而cf1們和CFp的虛線關係是什麼回事？

這實際上就是每一個CF的實例（cf1, cf2...）中，都有一個__proto__對象，它直接指向的是CF的prototype對象，所以是間接指向CFp對象。

圖中的關係寫成僞代碼大概是這樣：

function CFp()
{
this.xxx = function(){...};
}

function CF()
{
this.P1 = "p1";
this.P2 = "p2";
}

CF.prototype = new CFp();//圖中的實線關係：explicit prototype property

var cf1 = new CF();
var cf2 = new CF();
...

cf1.xxx(); //這裏就能夠經過cf1的__proto__引用到CF的prototype對象從而調用到CFp的xxx方法

從這裏能夠看出，javascript的prototype的確有點靜態（static）的意思，由於對於每一個函數（類比java中的類）的定義，都有一個惟一的prototype對象。

而隨着層次的增長，prototype會造成一個prototype chain，這個，能夠說就是javascript實現繼承效果的基礎吧？

可是，對這個圖還有一個疑問就是，左上角CF引出的虛線又是表明什麼關係呢？？

參考文獻：

[1] Javascript – How Prototypal Inheritance really works

[2] Javascript繼承機制的設計思想

[3] Web程序員應該知道的Javascript prototype原理