原型链是JavaScript中的“继承”。

JavaScript中的“类”

事实上JavaScript一直以来都是基于对象和原型的,除了Number、String、Boolean等基本数据类型之外,JavaScript中的一切都是对象。ES6中新增的class、constructor、static、extends、super等关键字都是基于对象和原型的语法糖。

JavaScript中的“继承”

我们知道extends关键字可以用来继承类,其实类会被babel编译成函数(也是对象),而对象就有原型链的说法。

什么是原型链

通俗地讲,你创建了一个对象a,然后基于对象a又创建了一个对象b(使用Object.create(obj)),这时访问b的属性,如果b没有这个属性,那么JavaScript会在b的原型中寻找这个属性,而b的原型包含a的所有属性。这样的继承关系可以存在于更多对象间,比如a->b->c从而形成了原型链。

JavaScript中原型链的使用

如何访问原型链

在JavaScript中,每一个对象都有一个__proto__属性,我们可以通过Obj.__proto__访问原型。

构造函数constructor有一个prototype属性,用构造函数创建的对象的__proto__实际上指向了constructor的prototype属性。我们可以通过Object.prototype查看Object的原型对象。

使用Class

Class与extends完全基于原型链。

使用new

用new创建对象时,对象的__proto__会指向构造器的prototype。在JavaScript中,构造器不一定是constructor(),任何一个函数(除箭头函数)都可以成为构造器,因此,只要设置好某个函数的prototype属性,new得到的对象就能使用原型链。

使用Object.create()

该函数的第一个参数就是新对象的原型。

使用JavaScript类型

例如,Array数组的原型链arr -> Array.prototype -> Object.prototype,Function类似。