資訊專欄INFORMATION COLUMN
摘要：從實(shí)現(xiàn)角度分析原型鏈歡迎來我的博客閱讀從實(shí)現(xiàn)角度分析原型鏈網(wǎng)上介紹原型鏈的優(yōu)質(zhì)文章已經(jīng)有很多了，比如說作為補(bǔ)充，就讓我們換個(gè)角度，從實(shí)現(xiàn)來分析一下吧本文假設(shè)你對(duì)原型鏈已經(jīng)有所了解。
從實(shí)現(xiàn)角度分析js原型鏈
歡迎來我的博客閱讀：《從實(shí)現(xiàn)角度分析js原型鏈》
網(wǎng)上介紹原型鏈的優(yōu)質(zhì)文章已經(jīng)有很多了，比如說：
https://github.com/mqyqingfeng/Blog/issues/2
https://github.com/creeperyang/blog/issues/9
作為補(bǔ)充，就讓我們換個(gè)角度，從實(shí)現(xiàn)來分析一下吧
畫個(gè)圖 第一步ps: 本文假設(shè)你對(duì)原型鏈已經(jīng)有所了解。如不了解，建議先看上面兩篇文章
創(chuàng)建一個(gè)函數(shù)時(shí)，會(huì)創(chuàng)建兩個(gè)對(duì)象：函數(shù)本身和它的原型對(duì)象
所以我們可以先畫個(gè)這樣的關(guān)系圖：
第二步ps: 圓形代表函數(shù)，矩形代表對(duì)象
通過函數(shù)創(chuàng)建的對(duì)象，其原型是函數(shù)的原型對(duì)象
再修改下關(guān)系圖：
第三步函數(shù)的原型對(duì)象的原型是 Object 的原型對(duì)象
再修改下關(guān)系圖：
第四步js的內(nèi)置函數(shù)對(duì)象也滿足這個(gè)規(guī)律
再修改下關(guān)系圖：
第五步Function 的原型對(duì)象是一個(gè)函數(shù)
再修改下關(guān)系圖：
第六步所有函數(shù)的原型都相同，都為 Function 的原型對(duì)象
再修改下關(guān)系圖：
第七步Object 的原型對(duì)象的原型是 null 意為不應(yīng)該存在
最后得到如下關(guān)系圖：
一些疑問 instanceofObject instanceof Function // true Function instanceof Object // true
首先需要確定的是，instanceof 運(yùn)算符相當(dāng)于如下代碼:
// L instanceof R
function instance_of(L, R) {
var O = R.prototype; // 取函數(shù) R 的原型對(duì)象
L = L.__proto__; // 取對(duì)象 L 的原型
while (true) { // 遍歷原型鏈
if (L === null)
return false;
if (O === L) // 函數(shù) R 的原型對(duì)象在對(duì)象 L 的原型鏈上
return true;
L = L.__proto__;
}
}
對(duì)于 Object instanceof Function 來說，就相當(dāng)于 Object.__proto__ === Function.prototype
因?yàn)樗泻瘮?shù)的原型都是 Function 的原型對(duì)象，所以是 true
對(duì)于 Function instanceof Object 來說，就相當(dāng)于 Function.__proto__ === Object.prototype
因?yàn)?Object 的原型對(duì)象處于原型鏈的頂部，所以 Object.prototype 一定在 Function 的原型鏈上，為 true
FunctionFunction.__proto__ === Function.prototype
對(duì)于這個(gè)，可以先把上面的關(guān)系圖變形一下：
可以看出：
所有函數(shù)都有與之對(duì)應(yīng)的原型對(duì)象
所有函數(shù)的原型都是 Function.prototype
Object.prototype 位于原型鏈的頂部，在所有對(duì)象的原型鏈上
根據(jù) 1 和 2，就可以得出 Function.__proto__ === Function.prototype
至于 Function.prototype 為什么是函數(shù)，可以先看看下面這個(gè)例子：
可以看出，Array.prototype 是 Array 類型，Map.prototype 是 Map 類型，Set.prototsype 是 Set 類型
所以，為了保持一致性，Function.prototype 也應(yīng)該是 Function 類型
End參考：
https://github.com/mqyqingfeng/Blog/issues/2
https://github.com/creeperyang/blog/issues/9
https://www.ibm.com/developerworks/cn/web/1306_jiangjj_jsinstanceof/index.html
https://stackoverflow.com/questions/7688902/what-is-functions-proto
https://stackoverflow.com/questions/572897/how-does-javascript-prototype-work
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/85094.html
摘要：雖然在腳本中沒有標(biāo)準(zhǔn)的方式訪問，但在每個(gè)對(duì)象上都支持一個(gè)屬性，用于訪問其構(gòu)造函數(shù)的原型對(duì)象。說的是構(gòu)造函數(shù)和原型對(duì)象之間的關(guān)系，說的是實(shí)例對(duì)象和原型對(duì)象之間的關(guān)系。 前言 在 segmentfault 上看到這樣一道題目： var F = function(){}; Object.prototype.a = function(){}; Function.prototype.b = fu...
摘要：一作用域域表示的就是范圍，即作用域，就是一個(gè)名字在什么地方可以使用，什么時(shí)候不能使用。概括的說作用域就是一套設(shè)計(jì)良好的規(guī)則來存儲(chǔ)變量，并且之后可以方便地找到這些變量。 一、作用域 域表示的就是范圍，即作用域，就是一個(gè)名字在什么地方可以使用，什么時(shí)候不能使用。想了解更多關(guān)于作用域的問題推薦閱讀《你不知道的JavaScript上卷》第一章（或第一部分），從編譯原理的角度說明什么是作用域。概...
摘要：或者說一直以來我是缺乏開發(fā)高性能網(wǎng)頁的意識(shí)的，但是想做一個(gè)好的前端開發(fā)者，是需要在當(dāng)自己編寫的程序慢慢復(fù)雜以后還能繼續(xù)保持網(wǎng)頁的高性能的。 不知道有多少人和我一樣，在以前的開發(fā)過程中很少在乎自己編寫的網(wǎng)頁的性能。或者說一直以來我是缺乏開發(fā)高性能網(wǎng)頁的意識(shí)的，但是想做一個(gè)好的前端開發(fā)者，是需要在當(dāng)自己編寫的程序慢慢復(fù)雜以后還能繼續(xù)保持網(wǎng)頁的高性能的。這需要我們對(duì)JavaScript語句，...
摘要：在上面的各種原型的變換中，其實(shí)難點(diǎn)就在于構(gòu)造函數(shù)也是對(duì)象原型對(duì)象等所有對(duì)象都由構(gòu)造這四個(gè)點(diǎn)。 這篇文章主要是學(xué)習(xí)一下JavaScript中的難點(diǎn)------原型和原型鏈 自定義一個(gè)對(duì)象 我們學(xué)習(xí)一門編程語言，必然要使用它完成一些特定的功能，而面向?qū)ο蟮恼Z言因?yàn)榉先祟惖恼J(rèn)知規(guī)律，在這方面做得很好，今天我以JS為例，探索一下JS不同于其他面向?qū)ο蟮恼Z言的地方-------原型和原型鏈 首...
閱讀 1646·2023-04-26 02:11
閱讀 2989·2023-04-25 16:18
閱讀 3720·2021-09-06 15:00
閱讀 2636·2019-08-30 15:55
閱讀 1942·2019-08-30 13:20
閱讀 2058·2019-08-26 18:36
閱讀 3131·2019-08-26 11:40
閱讀 2549·2019-08-26 10:11
