做個JS物件導向的筆記

每次遇到js面對物件這個概念，關於繼承及原型，腦海裡大概有個知識框架，但是很不系統化，複習下，將其系統化，內容涉及到物件的建立，原型鏈，以及繼承。

兩種常用方式，其餘的比較少見

工廠模式:

function createobject()
o.name = "nico"
o.age = 8
o.sayname = function()
return o
}

這種方式比較不開門見山，比較直接的事第二種，建構函式方式

function object(name, age)
}

通常使用第二種，比較直觀

考慮到函式也是物件的一種，每次物件的例項化中其方法也會跟隨著例項化一次，為了解決這個問題，因此出現了組合構造原型模式，這是最常用的一種方式。

組合構造原型模式

function object(name, age)
object.prototype.sayname = function()

將自身屬性於建構函式中定義，公用的方法繫結至原型物件上

原型物件的解釋

每乙個函式建立時本身內部會有乙個固有的原型物件，可以通過函式名.prototype 去訪問，而其原型物件又有乙個屬性constructor指標指向該函式。

假設有乙個建構函式

function person()
person.prototype.sayname = function()
var person1 = new person()
var person12 = new person()

其原型物件、建構函式、例項之間的關係如下

建構函式可以通過person.prototype來訪問原型物件，但是例項是沒有辦法來訪問原型物件的，但是在firefox、chrome、safari的每乙個例項物件都有乙個_proto_的屬性進行訪問其原型

原型鏈：

根據以上的原型關係可以發現，例項先從自身定義的屬性及方法中取值，若無法尋找到，則向上一級即原型物件訪問需要的屬性及方法，若其原型物件是另乙個物件的例項，仍無法訪問到屬性與方法的話，再繼續向該例項的原型物件訪問，這樣就構成了乙個原型鏈，也是繼承的實現方式。

有如下兩個物件

function supertype()
supertype.prototype.getsupervalue = function()
function subtype()
subtype.prototype = new supertype()
subtype.prototype.getsubvalue = function()
var instance = new subtype()
alert(instance.getsubvalue()) // false

這是乙個簡單的繼承實現方式，子類subtype具有了父類的property屬性，同時也具有getsubvalue的方法。

其原型鏈如下:

但是這樣做會將父類的屬性繫結至子類的原型上，如果父類具有按引用訪問的資料時，子類的某乙個例項中該資料的變化會導致所有子類例項該資料的變化，因此改進為借用建構函式模式的繼承

function subtype()

這樣就解決了該問題，將property屬性定義在了子類建構函式上，子類例項訪問時先從該本身建構函式具有的屬性中進行訪問，且進行操作，相當於覆蓋了原型上的該同名屬性。

但是上述的方法又出現了乙個別的問題，該問題也比較容易解決，比較少用到，筆記先到這，後續筆記將記錄該問題及解決辦法

做個JS物件導向的筆記

js物件導向筆記

JS學習筆記物件導向

js 物件導向相關筆記（五）

做個JS物件導向的筆記

js物件導向筆記

JS學習筆記 物件導向

js 物件導向相關筆記（五）

相關推薦

JS學習筆記物件導向