如果你能够啃下教程一并且吃透原型链的几个概念的话说明你在前端飞仙的路上又进了一小步···学习最怕的不是慢而是站！这篇教程主要目的对原型链概念进一步加深理解。

来看下面的例子：

var text=new String("我是文字");
function Persion(name,job){
    this.name=name;
    this.job=job;
}
Persion.myName="lxm";
Persion.prototype.sayName=function(){
    alert(this.name)；
}
var perison1=new Persion("lxm","20")

思考：判断下列表达式返回的值：
两分钟之内对八道的算及格，剩下的同学回头接着理解教程一 

perison1.__proto__===Persion.prototype;
perison1.name===Persion.name;
perison1.prototype.__proto__===Object.prototype;
Persion.prototype.__proto__===Object.prototype;
Persion.__proto__===Function.prototype;
Persion.constructor===perison1;
Function.__proto__===Object.prototype;
Function.prototype.__proto__===Object.prototype;
typeof Persion.prototype;
typeof Function.prototype;

• 圆形代表对象的名字
• 方形代表属性名
• 实线代表对象的分界
• 虚线代表引用
• 菱形代表基本值

    1、原型链是单链，只往一个方向流向，没有回路

    2、只有Function的proto指向自己的prototype，这也向我们解释了为什么Function.prototype类型是function

    3、我们通过proto只能获取到原型对象中的方法和属性，所以persion1通过原型链是获取不到Persion的myName属性，但是我们可以通过原型对象的constructor来获取或者修改Persion的属性（这点太给力了）

请注意，有时候这个方法也不好使，因为原型对象的constructor是可以改变的，不一定指向原型对象所在的函数对象

继续上面的例子：

persion1.__proto__.constructor.myName="我变了耶！";
console.log(Persion.myName); //我变了耶

    4、普通对象的proto_一定指向创造它的函数对象的prototype

    5、原型对象的proto一定指向Object.prototype！

    6、通过图我们可以简单理解，拥有原型对象属性的对象是函数对象，否则为普通对象

    7、原型链是有开始和尽头的，开始于null，结束于普通对象

    8、所有的函数对象都是Function以new的方式创造出来了，包括Function自己且每个函数对象的proto都指向了Function.prototype

    9、Object是所有对象的父类，我们也可以称之为基类，不过不要纠结于叫什么，因为我们通过图可以看到每一个对象（不管是原型对象还是普通对象还是函数对象）的通过原型链都可以引向Object.prototype

以上九条我称为原型链之九句真言（不要太在意名字，我自己随便起的 ～） 

意外收获：this.name和this.job难道不应该在Persion中也有一份吗？

无数个日夜，愚笨的博主对this的用法都不甚了解，直到我画出了这种图，我彻底明白了this的含义，就是谁运行包含this的这个函数，this就把挂在它身上的包袱（属性）甩给谁！看到了吗，persion1调用了Persion，那么自然多了2个属性，但是注意，name跟job并不是Persion的属性！！

思考：图中没有画出Object.proto的指向，请问他指向哪？(请只依据九句真言解答)

思考：判断下列表达式返回的值:

思考一：perison1.__proto__===Persion.prototype;

首先判断perison1是通过new方式被Persion创造出来的，依据九句真言第4条得出 ：true

思考二：perison1.name===Persion.name;

通过关系图可以看到不相等，我已经在意外收获中解答了，答案为:false

思考三：perison1.prototype.__proto__===Object.prototype;

只看图可以看到perison1没有prototype，是普通对象所以答案为:js报错～～

思考四：Persion.prototype.__proto__===Object.prototype;

参考九句真言第5条：答案为：true

思考五：Persion.__proto__===Function.prototype;

Persion为函数对象，参考九句真言第8条，答案为：true

思考六：Persion.constructor===perison1;

Persion是由Function创造出来的所以Persion.constructor指向Function，答案为：false

思考七：Function.__proto__===Object.prototype;

Function我们已经反复强调是由自身创造所以Function.proto===Function.prototype;,答案为：false

思考八：Function.prototype.__proto__===Object.prototype;

根据九句真言第5条，答案为：true

思考九：typeof Persion.prototype;

答案为：object

思考十：typeof Function.prototype;

✨✨新问题：图中没有画出Object.proto的指向，请问他指向哪？(请只依据九句真言解答)

Object.__proto__===Function.prototype
Function.prototype.__proto__===Object.prototype

不要太纠结于此，只要理解就好

好了，原型链的概念原理通过这2篇教程我相信大家已经滚瓜烂熟了！下面的教程，我们会着重研究下原型链在实际的应用！

✨✨拓展阅读：彻底深刻理解js原型链之prototype,proto以及constructor(一)

如需转载请与小助手（微信号：creditease_tech）联系。发现文章有错误、对内容有疑问，都可以通过关注宜信技术学院微信公众号（CE_TECH），在后台留言给我们。我们每周会挑选出一位热心小伙伴，送上一份精美的小礼品。快来扫码关注我们吧！

注：文章封面原图素材来源于网络，若有侵权请留言删除。

⏬点击“阅读原文”查看更多技术干货