javascript之原型

標籤：===   對象圖   nbsp   共用   mil   property   style   round   super   

 

寫作背景

最近在抓基礎，畢竟沒有好地基蓋樓容易塌啊...再回首javascript，原型可以說是該語言較為核心的設計之一，我們有必要瞭解下其設計理念 (#^.^#)

 

基本概念

• MyObject.prototype：用於建立由new MyObject()建立的對象的原型。
• _proto_：擷取obj對象的原型對象的非標準方法（只在某些瀏覽器支援，如chrome/safari/firefox）。
• Object.getPrototype(obj)：擷取obj原型對象的標準方法。
• 原型對象：包含由特定類型的所有執行個體共用的屬性和方法；prototype正指向這個對象。
• constructor：每個系統預設，注意系統預設的原型對象都有一個constructor屬性，指向其建構函式。

 

原型對象圖解

說明

• 每個函數都有一個prototype屬性，指向原型對象。
• 原型對象預設取得一個constructor屬性，這個屬性包含一個指向prototype屬性所在函數的指標。
• 建構函式建立的每個執行個體中包含一個[[prototype]]指標，指向建構函式的原型對象。（備忘：這個指標的標準訪問方式為Object.prototype(obj)，非標準訪問方式為_proto_）

 

Object、Function和原型關係

說明

• 首先Object和Function都是建構函式，而所有的建構函式的都是Function的執行個體對象. 因此Object是Function的執行個體對象。
• Function.prototype原型對象是Object的執行個體對象。
• 執行個體對象的原型(我們以proto來表示)會指向其建構函式的prototype屬性, 因此Object.proto ===Function.prototype,Function.proto===Function.prototype,Function.prototype.proto === Object.prototype
• 當我們訪問一個屬性值的時候, 它會沿著原型鏈向上尋找, 直到找到或者到Object.prototype.proto(為null)截止。

 

原型鏈實現繼承

本圖參考實現代碼見javascript進階程式設計

function SuperType(){this.property = true;}SuperType.prototype.getSuperValue = function(){return this.property;};function SubType(){this.subproperty = false;}//繼承了SuperTypeSubType.prototype = new SuperType();SubType.prototype.getSubValue = function (){return this.subproperty;};var instance = new SubType();alert(instance.getSuperValue()); //true

 

原型鏈弊端

• 在通過原型來實現繼承時，原型實際上會變成另一個類型的執行個體。於是，原先的執行個體屬性也就順理成章地變成了現在的原型屬性了。
• 沒有辦法在不影響所有對象執行個體的情況下，給超類型的建構函式傳遞參數。

 

希望文章對小夥伴有所協助，也非常歡迎指出文章存在問題，emmmmmmmmmm......

 

javascript之原型