JS原型链的一些理解

关于原型链我的理解是一个构造函数的原型作为另一个构造函数的实例形成的继承关系
在JS高级程序设计中有这样一个图

图片来源于JS高级程序设计

当我们定义一个函数时会有一个原型,即图中的SuperType Prototype,这时原型对象中会有一个constructor指向构造函数SuperType,这便是构造函数与原型对象之间的关系;

function Super(){
  this.name='bob';
  this.age=20;
}

此时如果再定义一个SubType构造函数,把SubType prototype作为构造函数SuperType的实例,便会有[[Prototype]]指向SuperType Prototype这样便形成了原型链,注意SubType Prototype已经没有constructor

function Super(){
  this.name='bob';
  this.age=20;
}

function Person(){};
Person.prototype = new Super();

原型链中的继承
上面代码中Person构造函数和prototype里什么也没定义,但是我们现在对Person进行实例,事实上我们是可以取到值的

var person = new Person();
console.log(person.name); //'bob'
console.log(person.age); //20

通过chrome控制台的打印我们可以发现这种继承关系,__prototo__:SuperPerson.prototype = new Super(); 存在Super中的属性;

image.png

constructor指向变化
JS高级程序设计说如果一个构造函数的原型对象作为另一个构造函数的实例,那么作为实例的原型对象的constructor就会消失,从上图中我们也能发现绿色框中没有constructor属性,这里当时我在想如果直接手动将constructor指为Person这个构造函数原型链是否会断裂

function Super(){
  this.name='bob';
  this.age=20;
}

function Person(){};
Person.prototype = new Super();

Person.prototype.constructor = Person;

console.log(Person.prototype);

var person=new Person();
console.log(person);

通过在控制台中打印可以发现constructor这里只作为一个属性,值为Person这个构造函数,而真正的影响指向的constructor为灰色


image.png

因此可以推断不存在手动更改constructor指向这么一说

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容