用比喻的方式理解JavaScirpt原型链

191 阅读2分钟

JavaScirpt原型链的探索

前言

参照文章

JavaScript 世界万物诞生记 这篇文章比喻还是挺好的,看完就理解了。

首先我们记住:

prototype的意思是原型。

__ proto __ 的意思是继承。

起源

造物主造了 null对象 来作为万物的起源。

光有 null 是不够的呀!

于是造物主造了一个有更多属性的对象暂时称呼为始祖


typeof null === 'object'

契机

始祖一个人实属无聊啊,想要多弄点对象出来玩。

于是始祖做了一个叫做Object机器,来帮忙制造更多的对象。

这个叫做Object机器依照的原型就是始祖

所以这里的始祖用代码来写就是Object.prototype


我为什么理解Object是个机器呢?

因为Object.prototype.constructor === Object

翻译成文字就是 对象 的 原型 的 构造器 是 对象

发展

随着对象越来越多,始祖觉得呀需要更多的工具来提高生活质量。

但是懒惰的始祖不想每一个工具都是自己亲手制造,他需要发明更多的机器

会偷懒的始祖居然发明了一个可以制造机器机器

这个机器的名字叫做Function,编号001。

随着时间的不断流逝,Function制造出来的东西逐渐替代了老一代的机器,甚至包括他自己。

于是就有了

Function.__proto__ === Function.prototype //true
Function.prototype.constructor === Function //true

编号001Function制造了编号002Function

编号002Function照着编号001Function原型,制造编号003Function

......

所以Function继承于Function原型


作为制造机器的机器Function,那其它的机器都是继承于他。

Object.__proto__ === Function.prototype //true
Array.__proto__ === Function.prototype //true
String.__proto__ === Function.prototype //true 
......

当然了,我们造的机器也是用的制造机器的机器Function

function Person(name, age){ 
    this.name = name;
    this.age = age;
 }
 Person.__proto__ === Function.prototype //true

那么ArrayPerson等等,这些机器是以什么为原型呢?

当然是Array.prototypePerson.prototype了,那么他们继承于哪里呢?

当然是第一个对象始祖:Object.prototype啦。


Array.prototype.__proto__ === Object.prototype  //true

最后

无标题-2022-01-24-1454.png