十分钟看懂JS原型和原型链

原型链图表

基础的原型链图就是这样，是否是看起来很绕呢，下面来进行一一讲解

原型（prototype）

• JS全部的函数都有prototype属性，只有函数才有
• 其属性和方法都能被构造函数实例化的对象所共同访问

从这个例子中能够看到 Person 这个原型链上的方法（sayHello）能够被实例化出来的对象p1所调用。而当咱们删除了 Person 原型链上的方法时，在p1上就调用不到 sayHello 这个方法了

构造器（constructor）

• constructor存在于每一个函数的prototype属性中，其指向了函数自己

原型链 (_proto_）

• JS中的对象会有个_proto_属性，指向了建立他的构造函数的prototype,而函数比较特殊也有这个属性

能够看出由Person这个函数实例化出的对象p1的_proto_ 是指向构造函数 Person 的 prototype

• 当JS搜索引擎查找对象中的属性或者方法时，若是在该对象上没有该属性和方法的话，会经过原型链一层一层往上查找

从这里咱们能够看出p1上是没有 sayHello 这个方法的 可是经过原型链往上查找就能够找到这个方法

实现一个简单的原型链

最后

说个题外话，我在一线互联网企业工做十余年里，指导过很多同行后辈。帮助不少人获得了学习和成长。

我意识到有不少经验和知识值得分享给你们，也能够经过咱们的能力和经验解答你们在IT学习中的不少困惑，因此在工做繁忙的状况下仍是坚持各类整理和分享。

我能够将最近整理的前端面试题免费分享出来，其中包含HTML、CSS、JavaScript、服务端与网络、Vue、浏览器、数据结构与算法等等，还在持续整理更新中，但愿你们都能找到心仪的工做。

有须要的朋友点击这里免费领取题目+解析PDF。

篇幅有限，仅展现部分截图：

点击这里免费领取题目+解析PDF。