js中__proto__, prototype的理解

做者：doris
連接：https://www.zhihu.com/question/34183746/answer/58155878
來源：知乎

首先，要明確幾個點：
1.在JS裏，萬物皆對象。方法（Function）是對象，方法的原型(Function.prototype)是對象。所以，它們都會具備對象共有的特色。
即： 對象具備屬性__proto__，可稱爲隱式原型， 一個對象的隱式原型指向構造該對象的構造函數的原型，這也保證了實例可以訪問在構造函數原型中定義的屬性和方法。

2.方法(Function)
方法這個特殊的對象，除了和其餘對象同樣有上述_proto_屬性以外，還 有本身特有的屬性——原型屬性（prototype），這個屬性是一個指針，指向一個對象，這個對象的用途就是包含全部實例共享的屬性和方法（咱們把這個對象叫作 原型對象）。原型對象也有一個屬性，叫作 constructor，這個屬性包含了一個指針，指回原構造函數。

 

好啦，知道了這兩個基本點，咱們來看看上面這副圖。
1.構造函數Foo()
構造函數的原型屬性Foo.prototype指向了原型對象，在原型對象裏有共有的方法，全部構造函數聲明的實例（這裏是f1，f2）均可以共享這個方法。

2.原型對象Foo.prototype
Foo.prototype保存着實例共享的方法，有一個指針constructor指回構造函數。

3.實例
f1和f2是Foo這個對象的兩個實例，這兩個對象也有屬性__proto__，指向構造函數的原型對象，這樣子就能夠像上面1所說的訪問原型對象的全部方法啦。

另外：
構造函數Foo()除了是方法，也是對象啊，它也有__proto__屬性，指向誰呢？
指向它的構造函數的原型對象唄。函數的構造函數不就是Function嘛，所以這裏的__proto__指向了Function.prototype。
其實除了Foo()，Function(), Object()也是同樣的道理。

原型對象也是對象啊，它的__proto__屬性，又指向誰呢？
同理，指向它的構造函數的原型對象唄。這裏是Object.prototype.

最後，Object.prototype的__proto__屬性指向null。


總結：
1.對象有屬性__proto__,指向該對象的構造函數的原型對象。
2.方法除了有屬性__proto__,還有屬性prototype，prototype指向該方法的原型對象。

 

__proto__ 與 prototype

顯式原型的做用：用來實現基於原型的繼承與屬性的共享。

隱式原型的做用：構成原型鏈，一樣用於實現基於原型的繼承。舉個例子，當咱們訪問obj這個對象中的x屬性時，若是在obj中找不到，那麼就會沿着__proto__依次查找。