图解原型链构成

本文不对原型链做过多的解释，意在理解记住原型链的构成。下面会用到一些图，先来看看每个图代表什么。

p0.jpg

首先来了解一下关键字的作用和约定

• 约定
  1、每个对象都有_ proto _属性。
  2、只有函数对象才有prototype属性。
  3、只有普通对象（本文特指prototype指向的对象）才有constructor属性。
• function关键字的作用（以 function A()为例）
  1、新建两个对象：函数对象A，普通对象A.prototype（简称为B）。
  2、A对象的_ proto 属性指向Function.prototype。
  3、A对象的prototype属性指向B,B的constructor属性指向A。
  4、B的 proto _属性指向Object.prototype（注意如果是function Object，那么Object.prototype的proto _属性指向null）。
  如下图所示：
  p2.jpg
• new关键字的作用 （以 new A（）为例）
  1、 new A（）创建出来的一个实例a，并且这个a的_ proto 属性指向A对象的prototype属性指向的对象，也就是： a. proto _=A.prototype。
  如下图所示：
  p1.jpg

在了解了上面信息之后，接下来的图就能看懂了。

1、js中一开始就有内置的Function、Object函数对象，看下图他们的结构：

p3.jpg

2、如果我们使用function定义了一个Cat的构造函数，那么结构就变成下图:

p4.jpg
3、如果我们再使用new，创建了Cat和Object的实例，看下图：
p5.jpg

总结：
1、构造函数对象的_ proto 都指向Function.prototype，也就是： A. proto =Function.prototype。
2、实例对象的 proto 都指向其对应构造函数的prototype指向，也就是：a. proto =A.prototype。
3、普通对象的 proto 都指向Object.prototype，也就是： A.prototype. proto _=Object.prototype。
4、普通对象的constructor都指向其对应构造函数，也就是：A.prototype.constructor=A。