js原型鏈

原型鏈?zhǔn)乔岸嗣嬖嚴(yán)镆粋€經(jīng)久不衰的問題了,今天就像自己歸納一下這個問題:

首先萧求,我們先來看一張圖:

原型鏈.png

這個繞來繞去的線是不是很惡心呢其兴?那就先別管這些了,等整個邏輯我們梳理完就自然而然的會明白了~

一夸政、 什么是原型鏈元旬?

每個對象都可以有一個原型proto,這個原型還可以有它自己的原型守问,以此類推匀归,形成一個原型鏈。查找特定屬性的時候耗帕,我們先去這個對象里去找穆端,如果沒有的話就去它的原型對象里面去,如果還是沒有的話再去向原型對象的原型對象里去尋找...... 這個操作被委托在整個原型鏈上仿便,這個就是我們說的原型鏈了体啰。

二、原型指針

我們知道了原型的概念嗽仪,接下來我們就照著上面的圖來具體分析一下原型的指針荒勇;中間最上面藍(lán)色模塊標(biāo)注的構(gòu)造函數(shù)Foo, 里面有兩個屬性: proto 和 prototype, 這兩個很容易使人混淆,先說說prototype:

prototype:

prototype屬性闻坚,它是函數(shù)所獨有的沽翔,它是從一個函數(shù)指向一個對象。它的含義是函數(shù)的原型對象窿凤,也就是這個函數(shù)(其實所有函數(shù)都可以作為構(gòu)造函數(shù))所創(chuàng)建的實例的原型對象; 這個屬性是一個指針仅偎,指向一個對象,這個對象的用途就是包含所有實例共享的屬性和方法(我們把這個對象叫做原型對象);

proto:

proto 是原型鏈查詢中實際用到的雳殊,它總是指向 prototype橘沥,換句話說就是指向構(gòu)造函數(shù)的原型對象,它是對象獨有的相种。注意威恼,為什么Foo構(gòu)造也有這個屬性呢,因為再js的宇宙里萬物皆對象寝并,包括函數(shù)箫措;

根據(jù)以上的概括我們能知道Foo構(gòu)造函數(shù)proto指向的是他的構(gòu)造函數(shù)的原型對象,它的構(gòu)造函數(shù)是Function, 也就是說Foo的proto指向Function.prototype, 我們再看到左邊綠色的a和b函數(shù)的proto指像的是Foo.prototype,因為他們是通過 new Foo實例化出來的衬潦,它們的構(gòu)造函數(shù)就是Foo(), 即a.proto = Foo.prototype斤蔓; 接著我們來看看最右邊紫色的模塊Function.prororype, 它的proto指針指向的是Object.prototype,Object.proto又為null.。于是我們就可以得出:在原型鏈中的指向是镀岛,函數(shù) → 構(gòu)造行數(shù) → Function.prototype → Object.protype → null ;

constructor:

我們看到途中最中間灰色模塊有一個constructor屬性弦牡,這個又是做什么用的呢?

每個函數(shù)都有一個原型對象漂羊,該原型對象有一個constructor屬性驾锰,指向創(chuàng)建對象的函數(shù)本身。

此外走越,我們還可以使用constructor屬性椭豫,所有的實例對象都可以訪問constructor屬性,constructor屬性是創(chuàng)建實例對象的函數(shù)的引用旨指。我們可以使用constructor屬性驗證實例的原型類型(與操作符instanceof非常類似)赏酥。

由于constructor屬性僅僅是原始構(gòu)造函數(shù)的引用,因此我們可以使用該屬性創(chuàng)建新的對象谆构,如:

image

通過第一個對象實例化對象的constuctor方法創(chuàng)建第2個實例化對象裸扶,說明創(chuàng)建的新對象ninja2 是Ninja的實例,由于ninja和ninja2不是同一個對象可以得出它們是兩個截然不同的實例搬素;

總結(jié)

1呵晨、proto 是原型鏈查詢中實際用到的,它總是指向 prototype熬尺;

2何荚、prototype 是函數(shù)所獨有的在定義構(gòu)造函數(shù)時自動創(chuàng)建猪杭,它總是被 proto 所指餐塘。

所有對象都有proto屬性,函數(shù)這個特殊對象除了具有proto屬性皂吮,還有特有的原型屬性prototype戒傻。prototype對象默認(rèn)有兩個屬性,constructor屬性和proto屬性蜂筹。prototype屬性可以給函數(shù)和對象添加可共享(繼承)的方法需纳、屬性,而proto是查找某函數(shù)或?qū)ο蟮脑玩湻绞揭张病onstructor不翩,這個屬性包含了一個指針,指回原構(gòu)造函數(shù)。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末口蝠,一起剝皮案震驚了整個濱河市器钟,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌妙蔗,老刑警劉巖傲霸,帶你破解...
    沈念sama閱讀 216,402評論 6 499
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異眉反,居然都是意外死亡昙啄,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,377評論 3 392
  • 文/潘曉璐 我一進(jìn)店門寸五,熙熙樓的掌柜王于貴愁眉苦臉地迎上來梳凛,“玉大人,你說我怎么就攤上這事梳杏×骢危” “怎么了?”我有些...
    開封第一講書人閱讀 162,483評論 0 353
  • 文/不壞的土叔 我叫張陵秘狞,是天一觀的道長叭莫。 經(jīng)常有香客問我,道長烁试,這世上最難降的妖魔是什么雇初? 我笑而不...
    開封第一講書人閱讀 58,165評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮减响,結(jié)果婚禮上靖诗,老公的妹妹穿的比我還像新娘。我一直安慰自己支示,他們只是感情好刊橘,可當(dāng)我...
    茶點故事閱讀 67,176評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著颂鸿,像睡著了一般促绵。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上嘴纺,一...
    開封第一講書人閱讀 51,146評論 1 297
  • 那天败晴,我揣著相機(jī)與錄音,去河邊找鬼栽渴。 笑死尖坤,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的闲擦。 我是一名探鬼主播慢味,決...
    沈念sama閱讀 40,032評論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼场梆,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了纯路?” 一聲冷哼從身側(cè)響起或油,我...
    開封第一講書人閱讀 38,896評論 0 274
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎感昼,沒想到半個月后装哆,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體罐脊,經(jīng)...
    沈念sama閱讀 45,311評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡定嗓,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,536評論 2 332
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了萍桌。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片宵溅。...
    茶點故事閱讀 39,696評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖上炎,靈堂內(nèi)的尸體忽然破棺而出恃逻,到底是詐尸還是另有隱情,我是刑警寧澤藕施,帶...
    沈念sama閱讀 35,413評論 5 343
  • 正文 年R本政府宣布寇损,位于F島的核電站,受9級特大地震影響裳食,放射性物質(zhì)發(fā)生泄漏矛市。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,008評論 3 325
  • 文/蒙蒙 一诲祸、第九天 我趴在偏房一處隱蔽的房頂上張望浊吏。 院中可真熱鬧,春花似錦救氯、人聲如沸找田。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽墩衙。三九已至,卻和暖如春甲抖,著一層夾襖步出監(jiān)牢的瞬間底桂,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,815評論 1 269
  • 我被黑心中介騙來泰國打工惧眠, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留籽懦,地道東北人。 一個月前我還...
    沈念sama閱讀 47,698評論 2 368
  • 正文 我出身青樓氛魁,卻偏偏與公主長得像暮顺,于是被迫代替她去往敵國和親厅篓。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,592評論 2 353

推薦閱讀更多精彩內(nèi)容

  • JS中原型鏈捶码,說簡單也簡單羽氮。 首先明確: 函數(shù)(Function)才有prototype屬性,對象(除Object...
    亞訊閱讀 4,756評論 1 8
  • 原型鏈?zhǔn)乔岸嗣嬖嚴(yán)镆粋€經(jīng)久不衰的問題了惫恼,自己也查閱了很多的資料档押,像紅寶書、JavaScript忍者秘籍上都有對這一...
    super_wei閱讀 107,159評論 10 63
  • 前言 在JavaScript中沒"子類”和“父類”的概念祈纯,進(jìn)一步地也沒有“類”和“實例”的的區(qū)分令宿。它靠一種看上去十...
    vzardlloo閱讀 793評論 0 5
  • 大家好,我是IT修真院成都分院第7期的學(xué)員韓建名腕窥,一枚正直純潔善良的WEB前端程序員粒没。 今天給大家?guī)淼氖牵篔S原...
    inh_閱讀 672評論 0 0
  • 我們會發(fā)現(xiàn) obj 已經(jīng)有幾個屬性(方法)了。那么問題來了:valueOf / toString / constr...
    隨便娶個名字閱讀 1,102評論 0 2