`
指甲刀X
  • 浏览: 33933 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

prototype、prototype.constructor、constructor.prototype的区别与联系

阅读更多

在js中经常可以接触到prototype、prototype.constructor、constructor.prototype,感觉像一个圈一样,绕来绕去,他们是什么关系,什么时候该用哪一个,这是让很多新学js的人困惑的问题。

 

 

我们知道在js中,prototype是函数的原型,定义了一类对象共有的属性(通常都是方法),是该类对象的"blueprint"。

constructor是对象的构造函数,当我们通过声明一个构造函数来创建“类”时,constructor属性被隐性的添加到该"类"的prototype上,指向该构造函数自己。我们可以通过下面的代码验证:

 

 

function ClassA(){} 
console.log(ClassA.prototype.constructor == ClassA); //true

 

之所以把构造函数自身的引用又添加到prototype,目的是方便我们区分不同对象的实例。

当我们执行var a = new ClassA()时,在堆内存中生成一个新的object,然后将隐性的创建__proto__属性指向ClassA的prototype,最后将该object的地址赋给栈中的变量a,这样我们就通过a可以访问到在ClassA的prototype上定义的一些属性方法。所以

 

function ClassA(){}
var a = new ClassA();
console.log(a.constructor === ClassA); //true

 既然a.constructor是ClassA,那么a.constructor.prototype当然就是ClassA的prototype了。

 

值得注意的是虽然通过

ClassA.prototype = {

              set = function (){},

              get = function (){}

}

的形式来添加原型方法很方便,却忽略了会重写ClassA原有的prototype,导致丢失constructor属性,所实例化的对象的constructor属性将变为function Object(){[native code]}。解决的办就是自己手动将constructor属性赋值给ClassA。


另外,由于任何function都是由Function对象实例化来的,所以每个function的constructor都指向Function(){}

 

function ClassA(){}
console.log(ClassA.constructor); //  function Function(){[native code]}
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics