圖說(shuō)原型鏈

Shonim 發(fā)布于2019-08-02 10:30 / 1583人閱讀

摘要：前言說(shuō)到原型鏈，中，萬(wàn)物皆對(duì)象，而規(guī)定，所有對(duì)象都有自己的原型對(duì)象，一方面，任何對(duì)象都可以充當(dāng)其他對(duì)象的原型，另一方面，原型也是對(duì)象，也擁有自己的原型，因此形成的鏈就是原型鏈。

前言

說(shuō)到原型鏈，javascript 中，萬(wàn)物皆對(duì)象，而 javascript 規(guī)定，所有對(duì)象都有自己的原型對(duì)象(prototype) ，一方面，任何對(duì)象都可以充當(dāng)其他對(duì)象的原型，另一方面，原型（prototype）也是對(duì)象，也擁有自己的原型，因此形成的鏈就是原型鏈。到這里我就啰嗦幾句，javascript 的設(shè)計(jì)者Brendan Eich在設(shè)計(jì)這門(mén)語(yǔ)言之初，只是想它在網(wǎng)頁(yè)上實(shí)現(xiàn)簡(jiǎn)單的交互，比如表單提交前進(jìn)行簡(jiǎn)單的校驗(yàn)，所以沒(méi)有設(shè)計(jì)類與繼承的概念，因?yàn)橛X(jué)得這樣的話太正式了，但是受時(shí)代的影響，javascript里面都是對(duì)象，雖然沒(méi)有繼承，但是也要一種機(jī)制，把這些對(duì)象聯(lián)系起來(lái)，這種機(jī)制就是原型鏈。話不多說(shuō)，上圖

圖解

假設(shè)有一個(gè)內(nèi)存空間（正方形表示），這片內(nèi)存里放了一個(gè)構(gòu)造函數(shù)Dog(用三角形表示)

function Dog () {
    this.leg = 4;
    this.bray = function () {
        alert("wangwang")；
    }
}

設(shè)置構(gòu)造函數(shù)的原型函數(shù)（prototype）

Dog.prototype = {
    spacies: "dog"
}
console.log(Dog.prototype)    // {spacies: "dog"}

那么，就會(huì)在另外一個(gè)內(nèi)存中存儲(chǔ) Dog 的 prototype 對(duì)象（用橢圓形表示），如圖所示，構(gòu)造函數(shù)的protype指向它的原型

現(xiàn)在我們用構(gòu)造函數(shù) Dog 來(lái)創(chuàng)建對(duì)象 dog1, dog2, ...

var dog1 = new Dog();
dog1.name = "大黃";
dog1.color = "yellow";

var dog2 = new Dog();
dog2.name = "小黑";
dog2.color = "black";

console.log(dog1.name)     // 大黃
console.log(dog2.name)     // 小黑
console.log(dog1.spacies)  // dog
console.log(dog2.spacies)  // dog
console.log(dog1.constructor === Dog)   // true

可以看到由構(gòu)造函數(shù)創(chuàng)造的對(duì)象dog1，dog2，他們的constructor指向構(gòu)造函數(shù)Dog，而他們的__proto__指向Dog的prototype，而且當(dāng)調(diào)用對(duì)象的一個(gè)屬性或方法時(shí)，首先會(huì)找對(duì)象本身的屬性或方法，找不到時(shí)，會(huì)找該對(duì)象的__proto__對(duì)象（也就是構(gòu)造函數(shù)的prototype對(duì)象），以此類推，會(huì)找原型鏈上所有對(duì)象有沒(méi)有該屬性，如果找到則返回該屬性的值，如果還是找不到則返回undefined
另外可以看出來(lái)dog1，dog2，...的__proto__指向同一塊內(nèi)存地址，這樣設(shè)計(jì)是為了節(jié)省內(nèi)存資源,不用每次創(chuàng)建都存儲(chǔ)他們相同的屬性，當(dāng)修改dog1的__proto__時(shí)，dog2的__proto__也會(huì)改變

dog1.__proto__.spacies = "animal"; // 或者Dog.prototype.spacies = "animal"
console.log(dog2.spacies)    // animal

上面也說(shuō)到了，每一個(gè)對(duì)象都有自己的__proto__，而作為構(gòu)造函數(shù)Dog的prototype對(duì)象，也會(huì)有自己的對(duì)象原型，以此類推，原型鏈的頂端是一個(gè)null,如圖的紅線串起來(lái)的鏈就是原型鏈

額，來(lái)一個(gè)句話收尾吧，這是我自己對(duì)原型連的理解，歡迎探討

參考

Javascript繼承機(jī)制的設(shè)計(jì)思想
prototype 對(duì)象

云服務(wù)器 GPU云服務(wù)器圖說(shuō)區(qū)塊鏈原型原型鏈原型鏈原型鏈繼承

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/52398.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

Shonim

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

#黑五#bluehost：虛擬主機(jī)、共享主機(jī)等最高優(yōu)惠75%，月付$2.65起

閱讀 1002·2021-11-24 10:30
短距離無(wú)線通訊-ZigBee

閱讀 2327·2021-10-08 10:04
解決esp8266 Mircopython OTA 遠(yuǎn)程升級(jí)方案

閱讀 3968·2021-09-30 09:47
騰訊云：輕量應(yīng)用服務(wù)器免費(fèi)升級(jí)配置活動(dòng),1核2G6M免費(fèi)升配2核4G6M

閱讀 1452·2021-09-29 09:45
pacificrack，秋季便宜美國(guó)VPS促銷，$18/年， 1核/2G內(nèi)存/30G SSD/1G帶

閱讀 1445·2021-09-24 10:33
網(wǎng)址主機(jī)名是什么-網(wǎng)址的主機(jī)名是什么？

閱讀 6271·2021-09-22 15:57
怎么選擇云主機(jī)-如何選擇云主機(jī)的配置？

閱讀 2358·2021-09-22 15:50
WHloud：$7/月/1GB內(nèi)存/20GB SSD空間/不限流量/50Mbps端口/KVM/韓國(guó)，

閱讀 4089·2021-08-30 09:45

成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

圖說(shuō)原型鏈

相關(guān)文章