从内存理解原型链的意义

原型链在js中是十分重要的一节，本文将从内存出发，解析js中的原型链。

首先用构造函数声明三个变量，此时的n、b、obj都被封装成了对象：

image.png
这三个变量上都有toString()方法
image.png
我们知道对象在栈中保存的是地址，这个地址会映射堆中的一个区域。（详见我的另一篇博客https://www.jianshu.com/p/de20f3bcfa3f）
回到正题，这三个变量都有toString方法，难道说他们在堆中的区域都各自保存了toString方法吗？像这样？
image.png
（注意：堆中的地址是随机的，我瞎写的....）
要是一个方法还好，再加多几个方法，岂不是十分占用内存？

js引擎就想：要是我有一个公共的容器，能将这些方法都装进去，然后大家都保存这个容器的地址，需要的时候来取不就好咯！

像这样：

image.png

这样的话，我们只用在公共容器里保存公共方法就可以了，内存就大大节省了！

不过，还有一个问题没有解决：
为了验证他们是不是公用的，我们看看n和b的toString方法是否绝对相等

image.png
居然是不相等的，那不是意味着他们并没有公用toString方法！
JS确实没有像我们想的那样做，但其实我们离真相已经很近了，为了保证不同类型的数据拥有不同的toString方法（比如number类型还能传参以不同进制输出），JS使用了原型链

这里以Number类型举例

image.png

JS引擎给Number类型划分了一块Number类型独有的公共区域，这也就是说：一个Number类型的变量，在引用方法的时候，会先看自己是不是一个对象，如果不是，JS就会将变量包装成临时对象，如果是对象或者已经包装成了临时对象，就会先在自己身上找，如果自己身上没有，就往Number类型公共区域找，如果Number类型公共区域中没有，就再往所有对象的公共区域上找，这种链式的查找，就形成了原型链
现在只要把上面的东西套个高大上一点的名字就是最终的原型链了！

image.png
我们将保存着公共区域地址的东西就做__proto__，将公共区域叫做prototype，一个对象的__proto__指向着他的构造函数的prototype，这个构造函数的__proto__又指向着再上一级的公共区域，而最上级的公共区域实际上也有__proto__，不过可想而知，既然已经是最上级的公共区域，指向的就是null了。

总的来说是这样的：
实例对象的原型链：
实例对象 -> 构造函数.prototype -> Object.prototype -> null

再来看一种特例，就是函数的原型链
由于函数是Function这个构造函数构造出来的，所以函数.__proto__指向的是Function.prototype，再往上？因为Function.prototype也是一个对象，是由Object这个构造函数构造出来的，也就是说Function.prototype.__proto__ === Object.prototype

总结一下函数的原型链：
函数 -> Function.prototype -> Object.prototype -> null

感谢阅读，如若文章有所疏漏还望指正。