簡述原型鏈是什麼，有什麼用處？

這裏是修真院前端小課堂，每篇分享文從

【背景介紹】【知識剖析】【常見問題】【解決方案】【編碼實戰】【擴展思考】【更多討論】【參考文獻】

八個方面深度解析前端知識/技能，本篇分享的是：

【簡述原型鏈是什麼，有什麼用處？】

 

【修真院web小課堂】

你們好，我是IT修真院上海分院第8期的學員周能，一枚正直純潔善良的web程序員，今天給你們分享一下，修真院官網web任務4，深度思考中的知識點——簡述原型鏈是什麼，有什麼用處？若想訪問一個對象的原型，應該使用什麼方法

 

 
（1）背景介紹：
什麼是原型

一個函數能夠當作一個類，原型是全部類都有的一個屬性，原型的做用就是給這個類的每個對象都添加一個統一的方法

 

 

PROTOTYPE

JS都是用new來從構造函數生成一個實例對象

構造函數生成的實例沒法共享屬性和方法，考慮到這點因而將prototype屬性引入到了JS中

PROTOTYPE這個屬性包含一個對象，裏面放着全部實例須要共享的方法和屬性，而不須要共享的屬性和方法能夠放在構造函數中

因爲全部的實例對象共享同一個prototype對象，那麼從外界看起來，prototype對象就好像是實例對象的原型，而實例對象則好像"繼承"了prototype對象同樣。

 

 

（2）知識剖析：
__PROTO__和PROTOTYPE

每一個對象都有一個__proto__屬性,而prototype只有函數纔有

對象是由構造函數建立的，函數也是對象，函數是由Function建立的，對象的__proto__等於建立者的prototype

 

 

 

 

什麼是原型鏈

每一個對象都有一個__proto__，它指向它的prototype原型對象，而prototype原型對象又具備一個本身的原型對象，就這樣層層向下上直到一個對象的原型prototype爲null 這個查詢的路徑就是原型鏈

 

 

 

（3）常見問題：
如何訪問一個對象的原型？

 

 

 

（4）解決方案：
 

__PROTO__,PROTOTYPE,OBJECT.GETPROTOTYPEOF()

prototype，只有函數對象才擁有一個屬性，用來訪問其原型對象

__proto__，是任何引用類型都擁有的屬性，指向其構造函數的prototype,可是並非標準寫法，是一個特殊的內部屬性

Object.getPrototypeOf()該屬性是ES5引入的一個標準屬性，用來獲取對象的原型，其做用和__proto__是同樣

 

function Pig(name) {

this.name = name

}

 

var a = new Pig("胖胖");

var b = new Pig("瘦瘦");

 

Pig.prototype.like = "red"

a.__proto__.like="red";

Object.getPrototypeOf(a).like="red"

 

 

（5）編碼實戰：
 

 

（6）拓展思考：
 

使用PROTOTYPE須要注意什麼

儘可能去修改增添，使用對象字面量建立原型方法要謹慎

 

 

function Pig(name) {

this.name = name

}

Pig.prototype = {//這個寫法必須寫到最上面，必需要在實例對象前面

like: "red",

}

 

var a = new Pig("胖胖");

var b = new Pig("瘦瘦");

 

Object.getPrototypeOf(a).like="red"

 

 

 

（7）參考文獻：
https://www.jb51.net/article/...

https://zhuanlan.zhihu.com/p/...

 

 

（8）更多討論：
一、什麼是原型？

   答：一個函數能夠當作一個類，原型是全部類都有的一個屬性，原型的做用就是給這個類的每個對象都添加一個統一的方法

 

 

 

二、什麼是原型鏈

    答：每一個對象都有一個__proto__，它指向它的prototype原型對象，而prototype原型對象又具備一個本身的原型對象，就這樣層層向下上直到一個對         象的原型prototype爲null 這個查詢的路徑就是原型鏈

 

 

 

三、如何訪問一個對象的原型？

答：prototype，只有函數對象才擁有一個屬性，用來訪問其原型對象

      __proto__，是任何引用類型都擁有的屬性，指向其構造函數的prototype,可是並非標準寫法，是一個特殊的內部屬性

      Object.getPrototypeOf()該屬性是ES5引入的一個標準屬性，用來獲取對象的原型，其做用和__proto__是同樣