資訊專欄INFORMATION COLUMN
摘要：又是一個比較重要的知識點(diǎn)原型。且和指向了同一個對象?？梢允鞘褂米鍪裁磩?chuàng)建對象的數(shù)據(jù)共享把一些實(shí)例共享的屬性和方法放在原型上，節(jié)約空間?；谠玩湹奈欣^承這個原型繼承的關(guān)系可以用圖來表示參考資料深入之從原型到原型鏈強(qiáng)大的原型和原型鏈
又是一個比較重要的知識點(diǎn)——原型（prototype）。
一個例子function F() {}
var f = new F()
F.prototype // {constructor: ?}
f.__proto__ // {constructor: ?}
F.prototype === f.__proto__ // true
F.prototype.constructor === F // true
可以看到F函數(shù)有一個屬性prototype指向了一個對象{constructor: ?}，由F函數(shù)new出來的對象f有一個屬性__proto__指向一個對象{constructor: ?}。且f.__proto__和F.prototype指向了同一個對象。F.prototype有一個constructor屬性又指回了F本身。
總結(jié)一下即是：
prototype：JavaScript中每個函數(shù)都有一個prototype屬性，此屬性指向了該函數(shù)的原型對象
__proto__：JavaScript中每一個對象（null除外），包括函數(shù)創(chuàng)建的對象、函數(shù)自身、原型對象，都有一個__proto__屬性，指向了創(chuàng)建該對象的函數(shù)的原型
constructor：該屬性屬于原型對象，指向相關(guān)的構(gòu)造函數(shù)
繼續(xù)探究既然剛剛說了每一個對象包括原型對象都有__proto__屬性，那么繼續(xù)來試驗(yàn)：
// 接上一段代碼
F.__proto // ? () { [native code] }
F.prototype.__proto__ // {constructor: ?, __defineGetter__: ?, __defineSetter__: ?, hasOwnProperty: ?, __lookupGetter__: ?,?…}
F.__proto__ === Function.prototype // true
F.prototype.__proto__ === Object.prototype // true
首先，F(xiàn)作為一個函數(shù)的同時它也是對象，所以它擁有屬性__proto__指向了Function.prototype，因?yàn)樗械暮瘮?shù)都可以理解為Function的實(shí)例；同樣的，F(xiàn).prototype作為一個對象，它的__proto__指向Object.prototype，因?yàn)樗菍ο笄覜]有指明的構(gòu)造函數(shù)，所以它直接是Object函數(shù)生成的實(shí)例，自然__proto__就指向Object.prototype。
現(xiàn)在再來探究一下Object.prototype作為一個對象，它的__proto__又指向了什么呢？
Object.prototype .__proto__ // null
Object.prototype.__proto__指向了null，這也說明了null是原型鏈的頂端。
上述的所有指向關(guān)系可以用一張圖來表示：
ps：這里面有一個細(xì)節(jié)，F(xiàn)unction.__proto__ === Function.prototype
Function作為方法，它有自己的prototype；Function作為對象，它的__proto__指向了Function.prototype，這似乎是在說：Function方法生成了Function對象？
針對這個問題，我覺得還是看這篇文章比較合適，我就不費(fèi)口舌了。
創(chuàng)建對象的數(shù)據(jù)共享
function Person(){}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
};
var person1 = new Person();
person1.sayName(); //"Nicholas"
var person2 = new Person();
person2.sayName(); //"Nicholas"
alert(person1.sayName == person2.sayName); //true
把一些實(shí)例共享的屬性和方法放在原型上，節(jié)約空間。
基于原型鏈的委托繼承function Child(){}
function Parent(){
this.name = "ppp"
}
Child.prototype = new Parent()
var c = new Child()
c.name // "ppp"
這個原型繼承的關(guān)系可以用圖來表示：
參考資料：
JavaScript深入之從原型到原型鏈
強(qiáng)大的原型和原型鏈
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/95223.html
摘要：之前總結(jié)了的一些常見綁定情況前端工程師手冊之的筆記，但是還有一些沒有說到，今天繼續(xù)學(xué)習(xí)一下。參考資料箭頭函數(shù)你不知道的上卷 之前總結(jié)了this的一些常見綁定情況（【前端工程師手冊】JavaScript之this的筆記），但是還有一些沒有說到，今天繼續(xù)學(xué)習(xí)一下。 es6箭頭函數(shù) 先說結(jié)論：箭頭函數(shù)沒有自己的this，它是根據(jù)外層(函數(shù)或者全局，后面會說到箭頭函數(shù)作為某個對象的方法時的情況...
摘要：函數(shù)別名是全局對象的屬性顯式綁定一個小栗子和第一個參數(shù)是一個對象，它們會把這個對象綁定到，接著在調(diào)用函數(shù)時指定這個。 今天總結(jié)一下this。 誤解 熟悉Java或者其他語言的同學(xué)看到this會想當(dāng)然的認(rèn)為this指向函數(shù)本身，然而在JavaScript中并不是這樣子。 function func(){ console.log(this.index) } func.index ...
摘要：本文最早為雙十一而作，原標(biāo)題雙大前端工程師讀書清單，以付費(fèi)的形式發(fā)布在上。發(fā)布完本次預(yù)告后，捕捉到了一個友善的吐槽讀書清單也要收費(fèi)。這本書便從的異步編程講起，幫助我們設(shè)計快速響應(yīng)的網(wǎng)絡(luò)應(yīng)用，而非簡單的頁面。 本文最早為雙十一而作，原標(biāo)題雙 11 大前端工程師讀書清單，以付費(fèi)的形式發(fā)布在 GitChat 上。發(fā)布之后在讀者圈群聊中和讀者進(jìn)行了深入的交流，現(xiàn)免費(fèi)分享到這里，不足之處歡迎指教...
摘要：本文最早為雙十一而作，原標(biāo)題雙大前端工程師讀書清單，以付費(fèi)的形式發(fā)布在上。發(fā)布完本次預(yù)告后，捕捉到了一個友善的吐槽讀書清單也要收費(fèi)。這本書便從的異步編程講起，幫助我們設(shè)計快速響應(yīng)的網(wǎng)絡(luò)應(yīng)用，而非簡單的頁面。 本文最早為雙十一而作，原標(biāo)題雙 11 大前端工程師讀書清單，以付費(fèi)的形式發(fā)布在 GitChat 上。發(fā)布之后在讀者圈群聊中和讀者進(jìn)行了深入的交流，現(xiàn)免費(fèi)分享到這里，不足之處歡迎指教...
閱讀 2981·2021-09-23 11:32
閱讀 2940·2021-09-22 15:12
閱讀 1721·2019-08-30 14:07
閱讀 3462·2019-08-29 16:59
閱讀 1652·2019-08-29 11:11
閱讀 2317·2019-08-26 13:50
閱讀 2436·2019-08-26 13:49
閱讀 2633·2019-08-26 11:49
