首页 > 技术文章 > 关于prototype与constructor的几点理解

yang30 2019-11-14 09:52 原文

首先要明确一点,js中的prototype是每个函数创建时(并非执行时,而是函数存在于堆区后)自动创建一个默认对象,这一对象中可以动态的添加属性

在new对象后,可以通过“对象.属性名”的方式直接调用prototype对象中的属性

但是,注意,prototype对象只在函数中存在(函数本身也是一个对象,可以具有属性/方法),通过构造函数创建的对象中不存在原型对象属性,而是存在一个指针,通常被命名为_proto_,这个并不是一个值为原型对象的属性,因此在new的对象中也无法访问。

 

constructor又是什么呢?

字面意思:构造器

function a(){

  this.age=12;

}

console.log(a.prototype)  // { constructor :  a() }

从打印出来的原型对象中可以看出,constrcutor是存在于原型对象中的一个属性,值为一个函数(此函数默认指向原型对象所属函数)

那么,问题来了:new是根据构造函数来创建对象,已经有了a()函数,为什么多此一举添加一个constructor属性呢?

我们打印一下constructor

console.log(a.prototype.constructor)  // a()

也就是说constructor属性值中并不存在已经得以好的a()函数已经定义好的age属性,想想也对age在new之前是属于window对象的属性,凭啥要回出现在构造函数中

实际上,new对象的过程大致是这样的:

首先编写一个函数,代码在被js引擎解析后函数存入堆区

解析到new语句时,先提取函数的prototype对象,根据原型对象中的constructor属性创建函数的对象

然后,创建new出来的对象与prototype对象的链接(在new出来的对象中添加一个指针)

最后,将a()函数中定义的属性复制一个副部给new出来的对象

推荐阅读