資訊專欄INFORMATION COLUMN
摘要：先來一個構(gòu)造函數(shù)構(gòu)造一個人類實(shí)例化一個對象看看的名字是什么打印結(jié)果先說一個前提只要是函數(shù)，就會有一個屬性，可以理解為子代的原型遺傳基因只要是對象，就會有一個方法，可以理解為向上尋找原型的方法。
關(guān)于javascript中的原型和原型鏈
? ? ? ? 關(guān)于javascript中的原型和原型鏈，可能都會想到一個詞“prototype”，而實(shí)際里面藏的是什么東西，才是大家應(yīng)該要掌握的。
? ? ? ? 看過一些文章，將原型和原型鏈說得很枯燥難懂，其實(shí)抽絲剝繭之后，理順?biāo)悸罚鋵?shí)原型和原型鏈沒有想象中的那么難以理解。我一直崇尚的是類比生活去理解，所以個人還是不太喜歡純敘述性的解釋。
? ? ? ? 其實(shí)很多講解的人，都是從自身角度出發(fā)的，解釋的都是理所當(dāng)然的，他們無法感受我們這些菜鳥的角度，不知道我們很多個為什么。當(dāng)然，當(dāng)我們了解理解之后，再重新看他們的文章，說的也是頭頭是道的。
? ? ? ? 關(guān)于原型這個詞，其實(shí)很好理解，可以說成是“原來的模型”。比如說，“兒子長得就像是爸爸一個模子出來一樣”，那爸爸就是兒子的原型，兒子繼承了爸爸的一些特征，當(dāng)然，兒子也會有自己的特征，這些特征，就是屬性。而有時候兒子有些特征沒有，可以在兒子的爸爸那里找到，甚至兒子爸爸那里找不到的特征，可以在爸爸的爸爸那里找到，而彼此之間維系著的，就是血緣關(guān)系，DNA傳遞，而這個關(guān)系鏈，就是我們說的原型鏈，當(dāng)然，往上找祖先，找到最后肯定是炎帝黃帝了，他們就是人類始祖了，如果他們身上還找不到，再往上找，就是空了，因?yàn)橥暇蜎]有祖先了，本來無一物，何處惹塵埃。
? ? ? ? 好了，開始來代碼了。
? ? ? ? 先來一個構(gòu)造函數(shù)：
//構(gòu)造一個人類
function Mankind(name){
this.name = name;
}
//實(shí)例化一個Dad對象
var Dad = new Mankind("BaBa");
//看看Dad的名字是什么
console.log(Dad.name);
//打印結(jié)果
BaBa
? ? ? ? 先說一個前提:
? ? ? ? 只要是函數(shù)，就會有一個 prototype 屬性，可以理解為子代的原型（遺傳基因）；只要是對象，就會有一個__proto__方法，可以理解為向上尋找原型的方法。
? ? ? ? 所以上面的構(gòu)造函數(shù)中，Mankind這個構(gòu)造函數(shù)，就會有一個prototype屬性（不是函數(shù)沒有），可以這樣訪問：Mankind.prototype，當(dāng)然也可以給傳統(tǒng)基因添加其他特征：
//還是上面的構(gòu)造函數(shù)
function Mankind(name){
this.name = name;
}
//還是實(shí)例化一個Dad對象
var Dad = new Mankind("BaBa");
//然后給構(gòu)造函數(shù)添加特征
Mankind.prototype.sayHello = "HaHaHa";
//看看Dad有沒有sayHello特征
console.log(Dad.sayHello);
//打印結(jié)果
HaHaHa
? ? ? ? 從結(jié)果可以看出，Dad本來沒有的sayHello特征，你給Dad的祖先添加了，Dad也會擁有這個特征了，其實(shí)這就是從原型鏈上找到這個屬性了。
? ? ? ? Dad對象這個實(shí)例的原型，就是Mankind.prototype這個遺傳基因。
? ? ? ? 而向上找原型，就是通過__proto__這個方法，所以：
Dad.__proto__ === Mankind.prototype ?//true
? ? ? ? 當(dāng)然，Mankind.prototype也是一個對象，當(dāng)然也有一個__proto__方法，通過這個方法，也是可以找到他再上一級的原型，所以：
Mankind.prototype.__proto__ === Object.prototype //true
? ? ? ? 這也是對的。因?yàn)楹瘮?shù)的祖先是Object，所以就是指向Object.prototype這個原型?。
當(dāng)然，再往上找，就是空了。
Object.prototype.__proto__ ?=== null ?//true
? ? ? ? 所以各個原型組織起來，就是一條原型鏈了：
? ? ? ? Dad ---> Mankind.prototype ---> Object.prototype ---> null ? 可以看到從對象開始的原型鏈的規(guī)律
? ? ? ? 回過頭來，其實(shí)Mankind.prototype這個對象除了__proto__這個方法外，還有一個constructor的方法，因?yàn)镸ankind是函數(shù)，所以有這個方法，所以通過這個方法，可以訪問到自身這個函數(shù)：
//打印一下Mankind.prototype.constructor
console.log(Mankind.prototype.constructor);
//打印結(jié)果
function Mankind(name){
this.name = name;
}
? ? ? ? 說到這里，相信已經(jīng)類比得很清楚了。然后又會有一個疑問：
? ? ? ? 既然說函數(shù)是對象(函數(shù)對象Function，普通對象Object，F(xiàn)unction是繼承于Object的)，那么前面的構(gòu)造函數(shù)Mankind可以有prototype屬性，也應(yīng)該有__proto__這個方法？
? ? ? ? 沒錯，所以我們也可以有Mankind.__proto__這個方法訪問原型:
Mankind.__proto__ === Function.prototype ?//true
? ? ? ? 當(dāng)然，F(xiàn)unction.prototype 也是可以通過__proto__方法訪問原型：
Function.prototype.__proto__ === Object.prototype //true
? ? ? ? 所以也有這樣的原型鏈：
? ? ? ? Mankind ---> Function.prototype ---> Object.prototype ---> null ? 可以看到從函數(shù)開始的原型鏈的規(guī)律
? ? ? ? 當(dāng)然了，我們既然有一個實(shí)例的對象Dad，當(dāng)然也可以再延生下去，生一個Son來繼承Dad的啦：
//從Dad那里繼承，創(chuàng)建一個son對象，下面兩種方法都可以： var Son = new Object(Dad); var Son = Object.create(Dad); //修改一下兒子的name Son.name = "ErZi"; //打印一下兒子的name和原型鏈上父親的name console.log(Son.name); console.log(Son.__proto__.name);//通過__proto__方法找到父親Dad //打印結(jié)果 ErZi BaBa
? ? ? ? 所以這條原型鏈?zhǔn)沁@樣的：
? ? ? ? Son ---> Dad ---> Mankind.prototype ---> Object.prototype ---> null ? 對照從對象開始的原型鏈的規(guī)律
? ? ? ? 通過上面的一大頓啰嗦，相信已經(jīng)很清楚了，最后再說一下雞和雞蛋的問題：
? ? ? ? 上面既然說到有Object.prototype，而且prototype是函數(shù)才有的，所以可以訪問到Object這個構(gòu)造函數(shù)，可以用Object.prototype.constructor這個方法，當(dāng)然構(gòu)造函數(shù)是繼承于函數(shù)對象的，所以構(gòu)造函數(shù)原型又是Function.prototype，所以也有這樣的一條原型鏈：
? ? ? ? Object ---> Function.prototype ---> Object.prototype ---> null ? 對照從函數(shù)開始的原型鏈的規(guī)律（這里的Object是構(gòu)造函數(shù)）
? ? ? ? 或者表示為：
? ? ? ? Object.prototype.constructor---> Function.prototype ---> Object.prototype ---> null
? ? ? ? 這就是雞和雞蛋的問題了。
? ? ? ? 最最后，放上一張網(wǎng)絡(luò)上解釋很清楚的原型鏈圖，再結(jié)合我上面的啰嗦，相信就很清楚容易明白了。
? ? ? ?
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/84257.html
摘要：要用作原型的對象。函數(shù)對象可以創(chuàng)建普通對象，這個我們上面講過了回顧一下這是一個自定義構(gòu)造函數(shù)普通對象沒法創(chuàng)建函數(shù)對象，凡是通過創(chuàng)建的對象都是函數(shù)對象，其他都是普通對象通常通過創(chuàng)建，可以通過來判斷。 關(guān)于js的原型和原型鏈，有人覺得這是很頭疼的一塊知識點(diǎn)，其實(shí)不然，它很基礎(chǔ)，不信，往下看要了解原型和原型鏈，我們得先從對象說起 創(chuàng)建對象 創(chuàng)建對象的三種方式： 對象直接量 通過對象直接量創(chuàng)建...
摘要：原文鏈接關(guān)于的原型和原型鏈，看我就夠了一參考鏈接闖關(guān)記之原型及原型鏈之原型與原型鏈一篇文章帶你理解原型和原型鏈徹底理解原型鏈一的默認(rèn)指向圖解和的三角關(guān)系原型和原型鏈三張圖搞懂的原型對象與原型鏈 溫故 創(chuàng)建對象的三種方式 通過對象直接量 通過new創(chuàng)建對象 通過Object.create() js中對象分為兩種 函數(shù)對象 普通對象 仔細(xì)觀察如下代碼 function Foo(na...
摘要：對于中的引用類型而言，是保存著它們所有實(shí)例方法的真正所在。高級程序設(shè)計(jì)構(gòu)造函數(shù)陌上寒原型對象有一個屬性，指向該原型對象對應(yīng)的構(gòu)造函數(shù)為什么有屬性那是因?yàn)槭堑膶?shí)例。 溫故 我們先回顧一下前兩天討論的內(nèi)容 創(chuàng)建對象的三種方式 通過對象直接量 通過new創(chuàng)建對象 通過Object.create() js中對象分為兩種 函數(shù)對象 普通對象 原型對象prototype 每一個函數(shù)對象都...
摘要：這幾天因?yàn)閷τ谥械淖饔糜蜴満驮玩溣悬c(diǎn)混淆，當(dāng)訪問一個不帶有修飾的變量時，我想知道它的搜索順序，因?yàn)樽饔糜蜴湹逆溄Y(jié)點(diǎn)也是一個變量對象，那么當(dāng)在這個變量對象中查找變量時會不會沿著它的原型鏈查找呢這樣就有兩種可能先查找作用域鏈前端的變量對象，然 這幾天因?yàn)閷τ贘avaScript中的作用域鏈和原型鏈有點(diǎn)混淆，當(dāng)訪問一個不帶有this修飾的變量時，我想知道它的搜索順序，因?yàn)樽饔糜蜴湹逆溄Y(jié)點(diǎn)也...
摘要：并沒有類繼承模型，而是使用原型對象進(jìn)行原型式繼承。我們舉例說明原型鏈查找機(jī)制當(dāng)訪問一個對象的屬性時，會從對象本身開始往上遍歷整個原型鏈，直到找到對應(yīng)屬性為止。原始類型有以下五種型。此外，試圖查找一個不存在屬性時將會遍歷整個原型鏈。 Javascript 并沒有類繼承模型，而是使用原型對象 prototype 進(jìn)行原型式繼承。 盡管人們經(jīng)常將此看做是 Javascript 的一個缺點(diǎn)，然...
閱讀 3533·2021-11-18 13:22
閱讀 2547·2021-09-23 11:53
閱讀 715·2019-08-30 13:17
閱讀 1339·2019-08-30 13:12
閱讀 891·2019-08-29 15:43
閱讀 1091·2019-08-29 12:53
閱讀 2826·2019-08-26 18:27
閱讀 1494·2019-08-26 11:52
