JavaScript 原型鏈學(xué)習(xí)總結(jié)
更新時(shí)間：2010年10月29日 21:05:30 作者：
在JavaScript中，一切都是對(duì)像，函數(shù)是第一型
Function和Object都是函數(shù)的實(shí)例
Function的父原型指向到Function的原型，F(xiàn)unction的原型的父原型是Object的原型。
Object的父原型也指向到Function的原型。
一個(gè)實(shí)例的對(duì)像，它的默認(rèn)的父原型為其構(gòu)造函數(shù)的顯示原型
[每個(gè)對(duì)像都有一個(gè)隱慝的屬性用于指向到它的父對(duì)像（構(gòu)造對(duì)像的函數(shù)）的原型(這里稱(chēng)為父原型或隱式原型）。因?yàn)樵鸵彩菍?duì)像,所以原型也有父原型,Object的原型是所有父原型的頂層(原型根)，這樣就形成了所謂原型鏈]
對(duì)像屬性訪問(wèn)原則
當(dāng)從一個(gè)對(duì)像那里讀取屬性時(shí)，如果對(duì)像自身屬性列表中不存在這樣的屬性，就會(huì)去自己關(guān)聯(lián)的父原型對(duì)像那里尋找，如果父原型對(duì)像屬性列表中也沒(méi)有這樣的屬性則會(huì)這個(gè)父原型的父原型那里查找，直到找到或直到對(duì)頂層原型[Object.prototype]對(duì)像屬性列表的查找完畢
調(diào)用對(duì)象的方法跟訪問(wèn)屬性搜索過(guò)程一樣，因?yàn)榉椒ǖ暮瘮?shù)對(duì)象就是對(duì)象的一個(gè)屬性值。
實(shí)例：
Object.prototype.m1 = function(){
alert("我是獅子");
}
function Class1(str){
this.p1 = str;
}
function Class2(){}
Class2.prototype.m1 = function(){
alert("你好");
}
var n1 = new Class1("毛獅子");
//@__proto__屬性是對(duì)像父原型的引用
//@Object.prototype.__proto__=null
/*
n1的原型鏈
n1.__proto__=Class1.prototype
Class1.prototype.__proto__=Object.prototype
*/
var n2 = new Class2();
/*
n2的原型鏈
n2.__proto__=Class2.prototype
Class2.prototype.__proto__=Object.prototype
*/
n1.m1();//===Object.prototype.m1();
n2.m1();//===Class2.prototype.m1();
alert(n1.p1);//毛獅子
alert(n2.p1);//undefined
Function的父原型指向到Function的原型，F(xiàn)unction的原型的父原型是Object的原型。
Object的父原型也指向到Function的原型。
一個(gè)實(shí)例的對(duì)像，它的默認(rèn)的父原型為其構(gòu)造函數(shù)的顯示原型
[每個(gè)對(duì)像都有一個(gè)隱慝的屬性用于指向到它的父對(duì)像（構(gòu)造對(duì)像的函數(shù)）的原型(這里稱(chēng)為父原型或隱式原型）。因?yàn)樵鸵彩菍?duì)像,所以原型也有父原型,Object的原型是所有父原型的頂層(原型根)，這樣就形成了所謂原型鏈]
對(duì)像屬性訪問(wèn)原則
當(dāng)從一個(gè)對(duì)像那里讀取屬性時(shí)，如果對(duì)像自身屬性列表中不存在這樣的屬性，就會(huì)去自己關(guān)聯(lián)的父原型對(duì)像那里尋找，如果父原型對(duì)像屬性列表中也沒(méi)有這樣的屬性則會(huì)這個(gè)父原型的父原型那里查找，直到找到或直到對(duì)頂層原型[Object.prototype]對(duì)像屬性列表的查找完畢
調(diào)用對(duì)象的方法跟訪問(wèn)屬性搜索過(guò)程一樣，因?yàn)榉椒ǖ暮瘮?shù)對(duì)象就是對(duì)象的一個(gè)屬性值。
實(shí)例：
復(fù)制代碼 代碼如下:
Object.prototype.m1 = function(){
alert("我是獅子");
}
function Class1(str){
this.p1 = str;
}
function Class2(){}
Class2.prototype.m1 = function(){
alert("你好");
}
var n1 = new Class1("毛獅子");
//@__proto__屬性是對(duì)像父原型的引用
//@Object.prototype.__proto__=null
/*
n1的原型鏈
n1.__proto__=Class1.prototype
Class1.prototype.__proto__=Object.prototype
*/
var n2 = new Class2();
/*
n2的原型鏈
n2.__proto__=Class2.prototype
Class2.prototype.__proto__=Object.prototype
*/
n1.m1();//===Object.prototype.m1();
n2.m1();//===Class2.prototype.m1();
alert(n1.p1);//毛獅子
alert(n2.p1);//undefined
您可能感興趣的文章:
- javascript prototype 原型鏈
- Javascript之旅 對(duì)象的原型鏈之由來(lái)
- javascript學(xué)習(xí)筆記（九）javascript中的原型(prototype)及原型鏈的繼承方式
- 深入理解JavaScript系列(6) 強(qiáng)大的原型和原型鏈
- 基于JavaScript實(shí)現(xiàn)繼承機(jī)制之構(gòu)造函數(shù)+原型鏈混合方式的使用詳解
- 基于JavaScript實(shí)現(xiàn)繼承機(jī)制之原型鏈(prototype chaining)的詳解
- javascript學(xué)習(xí)筆記（一）基礎(chǔ)知識(shí)
- javascript學(xué)習(xí)筆記（二）數(shù)組和對(duì)象部分
- javascript學(xué)習(xí)筆記（三）BOM和DOM詳解
- javascript學(xué)習(xí)筆記（四）function函數(shù)部分
- javascript學(xué)習(xí)筆記（五）原型和原型鏈詳解
相關(guān)文章
JavaScript設(shè)計(jì)模式發(fā)布訂閱模式
這篇文章主要介紹了JavaScript設(shè)計(jì)模式發(fā)布訂閱模式，發(fā)布訂閱設(shè)計(jì)模式是和觀察者設(shè)計(jì)模式基本上相同，但是他們兩個(gè)設(shè)計(jì)模式不同的是發(fā)布訂閱者擁有一個(gè)事件處理中心而觀察者并沒(méi)有2022-06-06
利用threejs實(shí)現(xiàn)一個(gè)簡(jiǎn)易的泊車(chē)功能
這篇文章主要為大家詳細(xì)介紹了如何利用threejs實(shí)現(xiàn)一個(gè)簡(jiǎn)易的泊車(chē)功能,文中的示例代碼講解詳細(xì),對(duì)大家的學(xué)習(xí)和工作有一定的幫助,感興趣的小伙伴可以動(dòng)手嘗試一下2024-01-01
js 與或運(yùn)算符 || && 妙用，可用于精簡(jiǎn)代碼，降低程序的可讀性。2009-12-12
JavaScript中的return語(yǔ)句簡(jiǎn)單介紹
return語(yǔ)句在js中起到舉足輕重的作用，該關(guān)鍵字不僅具有返回函數(shù)值得功能，還具有一些特殊的用法，有個(gè)清晰的把握是非常有必要的，下面通過(guò)本篇文章給大家簡(jiǎn)單介紹下return語(yǔ)句的作用2015-12-12
JS獲取字符對(duì)應(yīng)的ASCII碼實(shí)例
下面小編就為大家?guī)?lái)一篇JS獲取字符對(duì)應(yīng)的ASCII碼實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就想給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
微信小程序的運(yùn)行機(jī)制與安全機(jī)制解決方案詳解
這篇文章主要介紹了微信小程序的運(yùn)行機(jī)制與安全機(jī)制解決方案，接觸小程序有一段時(shí)間了，總得來(lái)說(shuō)小程序開(kāi)發(fā)門(mén)檻比較低，但其中基本的運(yùn)行機(jī)制和原理還是要懂的2023-02-02
支持IE和FF的div＋css選項(xiàng)卡...2006-11-11
這篇文章主要介紹了JavaScript異步forEach的相關(guān)知識(shí)，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-07-07
微信小程序如何加載數(shù)據(jù)庫(kù)真實(shí)數(shù)據(jù)的實(shí)現(xiàn)
這篇文章主要介紹了微信小程序如何加載數(shù)據(jù)庫(kù)真實(shí)數(shù)據(jù)的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它簡(jiǎn)潔靈活，使得 Web 開(kāi)發(fā)更加快捷。本文給大家介紹Bootstrap 頁(yè)面排版樣式的相關(guān)知識(shí)，希望對(duì)大家有所幫助！2016-04-04