JavaScript中原型和原型鏈

原型[prototype]:

為其他物件提供共享屬性的物件。

每個函式都有乙個原型(prototype)屬性，這個屬性是乙個指標，指向乙個物件，這個物件包含特定例項共享的一些屬性和方法。

以例服人：

這個例子說明了原型物件是共享的，並且是乙個指標，並且物件的例項中也有指向prototype指向物件的指標。

function
animal(name) 
animal.prototype.runs = function
() var dog = new animal('小狗')
dog.runs()  
//輸出"小狗跑起來了"
//下面增加的方法，dog物件可以使用嗎？
animal.prototype.hi = function() 
dog.hi() 
//輸出"hi",說明原型屬性是乙個指標，指向乙個共享物件，不管先新增的還是後新增的方法都能呼叫
//dog作為乙個animal例項，他的__proto__屬性和animal.prototype指向同乙個物件，所以才可以使用原型的方法。
console.dir(dog) //
檢視 dog.__proto__
//dog.__proto__  &  animal.prototype
console.log(dog.__proto__ === animal.prototype) //
true,有相同的指標位址

原生建構函式的原型物件[不單函式有原型物件]

console.dir(object.prototype)

console.dir(array.prototype)

console.dir(string.prototype)

console.dir(date.prototype)

再看乙個__proto__ & prototype的例子

var obj =
obj.tostring()   
//"[object object]"
//obj 物件為什麼有 tostring 方法？
//因為 obj 物件是 object 建構函式的例項，obj 物件的原型指標指向 object.prototype 物件。console.log(obj.__proto__  === object.prototype )

通過原型關係圖理解：

再看乙個函式的原型的例子

var obj = 
function
getname() 
//問題：animal.call 方法來自哪？
getname.call(obj)  //
來自function物件
console.dir(getname)
console.log(getname.__proto__  === function.prototype)  //
true
console.log(function.prototype.__proto__  === object.prototype)  //
true

通過原型關係圖理解

原型繼承：

function
animal() 
animal.prototype.runs = function
() function
bird() 
bird.prototype = new
animal()  //讓bird的原型等於animal的例項，因為new animal中有__proto__指向animal.prototype的指向(沿著原型鏈尋找)，此處也可以寫為bird.prototype = animal.prototype
bird.prototype.fly = function
() function
crow(name) 
crow.prototype = new
bird()
crow.prototype.drink = function
() var crow = new crow('乙隻可愛的小烏鴉')
crow.drink().runs().fly()
console.dir(crow)

輸出結果：

原型總結：

每乙個建構函式都有乙個和其對應的原型物件。

建構函式的 prototype 屬性和其實例物件的「__proto__」屬性指向同乙個物件。

某建構函式的所有例項物件，共享乙份原型物件。

所有的物件都可以通過「__proto__」屬性，最終連線到 object.prototype 物件。

建構函式用 prototype 來定義原型的屬性和方法，例項物件用「__proto__」來查詢原型的屬性和方法。

當查詢乙個物件的屬性或方法時，js引擎會向上遍歷其原型鏈，直到找到給定名稱的屬性為止。如果最終在 object.prototype 物件仍然沒有找到此屬性或方法，則返回 undefined 值。

JavaScript中原型鏈的那些事

在物件導向的語言中繼承是非常重要的概念，許多物件導向語言都支援兩種繼承方式介面繼承和實現繼承。介面繼承制只繼承方法簽名，而實現繼承繼承實際的方法。在ecmascript中函式沒有簽名，所以ecmascript無法實現介面繼承，只能實現實現繼承。那麼是怎麼實現實現繼承的呢？這就要說一說js中的原型鏈...

js中原型和原型鏈

let hd new object object.prototype.show function function getname console.dir getname console.log getname.prototype.proto getname.proto proto true con...

JavaScript中原型鏈存在的問題解析

本文通過例項給大家介紹js原型鏈存在的問題解析，非常不錯，具有參考借鑑價值，感興趣的朋友一起看看吧我們知道使用原型鏈實現繼承是乙個goodway 看個原型鏈繼承的例子。1 2 3 4 5 6 7 8 9 10 11 functiona a.prototype.getabc function fun...

JavaScript中原型和原型鏈

JavaScript中原型鏈的那些事

js中原型和原型鏈

JavaScript中原型鏈存在的問題解析

相關推薦