图解javascript原型链

责任编辑永久性有效率镜像: https://github.com/AttemptWeb……

蓝本链和蓝本第一类是js的核心理念，js以蓝本链的方式，确保表达式或第一类中的方式、特性能让向上传递，依照面向第一类的讲法，这是承继。而js透过蓝本链才以求同时实现表达式或第一类的承继，所以上面他们就来聊聊聊js中的蓝本链。下列图为主，请安心饮用。

prototype和constructor

prototype对准表达式的蓝本第一类，这是两个显式蓝本特性，多于表达式才保有该特性。constructor对准蓝本第一类的构造表达式。

// 能思索呵呵的列印结论，它依次对准谁 function Foo() {} console.log(Foo.prototype) console.log(Foo.prototype.constructor) console.log(Foo.__proto__) console.log(Foo.prototype.__proto__)

上面来看一看各构造表达式与它他们蓝本第一类间的亲密关系：

proto

每一对象都有_proto_，它是显式蓝本特性，对准了建立该第一类的构造表达式蓝本。虽然js中是没类的基本概念，而为的是同时实现承继，透过 _proto_ 将第一类和蓝本联络出来共同组成蓝本链，就能让第一类出访到不属于他们的属性。

表达式和第一类间的亲密关系

Foo、Function和Object都是表达式，它的_proto_都对准Function.prototype。

蓝本第一类间的亲密关系

它的_proto_都对准了Object.prototype。js蓝本链最终对准的是Object蓝本第一类

_proto_蓝本链图

相信只要你看懂了上面的图表，所以你应该就已经理解了js的蓝本链了。

总结

Function 和 Object 是两个表达式。proto 将第一类和蓝本连接出来共同组成了蓝本链。所有的表达式的 proto 都对准Function蓝本第一类。js的蓝本链最终对准的是Object蓝本第一类(Object.prototype)（在这里我将null排除在外了）。

2022.02.23号补充：

虽然是2019年的文章，当时的他们只是为的是理清楚，蓝本链的整个链条，它是如何同时实现承继或方式复用的，并没考虑它实例的样子，真的非常抱歉缺失一环，目前虽然思维导图工具已找不到，只能透过代码补充下了。

let f = new Foo(); f.constructor === Foo; f._proto_ === Foo.prototype

实例化第一类f 构造表达式对准 Foo，虽然实例化第一类f 是不存在显示蓝本(f.prototype)，实例化第一类f 透过显式蓝本_proto_ 确保蓝本链条的连续和衔接。所以这里又能看到两个有趣的情况，这是非常优雅且工整的

f._proto_ === Foo.prototype Foo._proto_ === Function.prototype

最终的对准不需要解释了，上面的图中已经有讲到了。其实以上的内容红皮书中都有，新人在阅读时，进行一定程度的拆解就好，希望能帮助大家，迟到的补充。

prototype和constructor

proto

表达式和第一类间的亲密关系

蓝本第一类间的亲密关系

_proto_蓝本链图

总结

相关文章

微信