JavaScript對象系統深入剖析3-創建對象Object.Create

3.創建對象Object.Create 

 

@吳穹Adam

 

看這兩天同學們的反饋還是覺得比較難懂,因此,決定再舉一個例子幫助大傢理解吧,後面有關Scope和閉包Closure的精彩內容就隻好晚一點寫瞭!

 

其實,這個系列不是寫給初學者的,而是寫給那些中級JS程序員的,對JS有一定的認識,希望這個系列能夠幫助他們透過現象看到本質。同時,這裡面的內容是高度濃縮的,向1,2節基本上對應瞭JavaScript: The Good Parts兩章的內容,因此,建議感興趣的同學,最好根據上面的例子程序,配合Debugger,仔細體會可能才能理解,指望光看這個博客系列就完全搞懂JS的對象系統是不太切合實際的。

 

另外,如果你隻是簡單寫寫網頁,的確可能不需要把JS搞懂這麼清楚,但是如果你真正重視JS,打算應用例如node.js,backbone.js這樣的JS框架的話,那麼,我認為還是需要真正把JS搞明白的。

 

同時,在閱讀下面內容之前,請先閱讀1,2:

1. 對象:/kf/201201/117897.html

2.函數對象:/kf/201201/117898.html

好,切入正題吧,在JavaScript: The Good Parts當中,給出瞭一個創建對象的常用方式:

Object.create = function (o) {

         var F = function () {};

         F.prototype = o;

         return new F();

     };

var b=Object.create(a);

        

結合1,2節的內容,我們來理解一下上述這段代碼:

 

首先,在執行var b=Object.create(a);之前,已經有瞭a對象,如下圖:

 

在執行瞭var F = function () {};之後,F函數對象被創建出來,他的property屬性也被賦值指向一個新創建出來的對象,詳細規則在第二節描述過:

當用var ff = function(){}定義一個函數時,JS會生成一個函數對象F,函數對象F的__proto__指針指向Function.prototype(在下圖中省略瞭), 同時F還會有一個property屬性,property屬性的值指向一個新創建的對象P,這個對象P隻有一個屬性是構造函數constructor(),構造函數constructor()的值就是函數對象F,而對象P的__proto__指針則指向Object.Prototype,

 

 

執行瞭F.prototype = o; 之後, F的prototype屬性指向瞭對象A,如下圖所示:

 

執行new F();之後,根據第2節中描述的規則,執行之後的對象關系如下:

當用new激活一個函數時,一個新對象會被創建出來,其內容是執行函數的返回結果,而這個對象的__proto__鏈接指向函數的prototype屬性所引用的對象

 

函數Object.create返回之後,F和p都不存在瞭,因此,最後的對象關系如下:

 

總結一下,我們可以看到,對象的__proto__鏈接是不能直接修改的,而函數對象的prototype屬性是可以修改的,因此,Object.create實際上是利用瞭這個特點,結合new來完成瞭一個拷貝創建的過程,希望這個例子能夠幫助大傢更好地理解!!

發佈留言