资讯专栏INFORMATION COLUMN

JavaScript中constructor属性

ISherry / 2709人阅读

摘要:属性中属性指向创建当前对象的构造函数。既然是属性时从属于构造函数的那么为什么实例也有属性呢,这是为什么原因如下本身还是实例的原型。

constructor属性

JavaScript中constructor属性指向创建当前对象的构造函数。

var a = "zuckjet";
console.log(a.constructor)  // ƒ String() { [native code] }

function b() {}
console.log(b.constructor)  // ƒ Function() { [native code] }

var c = {name: "zuckjet"};
console.log(c.constructor);  //ƒ Object() { [native code] }
起源

看了上面的代码示例,也许你会觉得constructor属性在对象里,但其实constructor属性是在原型里。

function test() {}
var obj = new test();
console.log(obj.hasOwnProperty("constructor")); //false
console.log(obj.__proto__.hasOwnProperty("constructor")); //true

hasOwnProperty方法是来判定对象是否包含指定名称的属性,不会向原型链搜索。要想搜索原型链可以用in关键字(’constructor’ in obj)。

既然是constructor属性时从属于构造函数的prototype,那么为什么实例也有constructor属性呢?

function Foo() {}
var foo = new Foo()
foo.constructor === Foo // true,这是为什么

原因如下:

Foo.prototype本身还是实例foo的原型。

由于原型链机制,当在foo中查找属性constructor时,如果没有找到,则往原型上找。而Foo.prototype刚好有属性constructor。

foo.constructor的值就是Foo.prototype.constructor的值,也就是Foo。

constructor属性是不可靠的
function Foo() {}
Foo.prototype = {}
var foo = new Foo()
foo.constructor === Object  // true,可以看出不是Foo了

foo没有constructor属性,还是往原型Foo.prototype上找

Foo.prototype本来是有constructor属性的,但是在这里它已经被重新定义变成{}

找不到constructor,接着往原型链上查找。({}是由Object构造函数生成的,它的原型是Object.prototype)找到了Object.prototype,含有属性constructor,值为Object

用处

为了将实例的构造器的原型对象暴露出来, 比如你写了一个插件,别人得到的都是你实例化后的对象, 如果别人想扩展下对象,就可以用 instance.constructor.prototype 去修改或扩展原型对象

部分内容参考自:
参考链接1
参考链接2

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107377.html

相关文章

  • javascriptconstructor&&prototype

    摘要:于是退而求其次叫为类的构造函数。如果这个函数被用在创建自定义对象的场景中,我们称这个函数为构造函数。遇到的问题始终指向创建当前对象的构造函数。 Object.constructor,prototype 对象的prototype和constructor是两个重要的属性,他们总是成对出现,提到constructor的地方,不得不涉及到另外一个非常重要的属性prototype,它是js中基于...

    huaixiaoz 评论0 收藏0
  • 讲清楚之 javascript原形

    摘要:构造函数和实例都通过属性指向了原形。代码示例是构造函数的实例的属性与的属性保存的值相等,即他们指向同一个对象原形。 讲清楚之javascript原型 标签: javascript javascript 中原形是一个比较难于理解的概念。javascript 权威指南在原形这一章也花了大量的篇幅进行介绍,也许你已经读过javascript 权威指南,或者已经是读第N篇了,然而这篇文章的目...

    高胜山 评论0 收藏0
  • 我来重新学习 javascript 的面向对象(part 2)

    摘要:先来说其实构造函数也有,原型对象有,实例有也有,或者更加笼统的说,所有对象都是有的。构造函数的原型对象上的会指向构造函数。由于属性是可以变更的,所以未必真的指向对象的构造函数,只是一个提示。 续上一集内容,通过构造函数的方式,成功地更新了生产技术,老板笑呵呵,工人少奔波,只是问题总比办法多,又遇到一个新问题,就是会造成一些资源的重复和浪费,那么经过工程师们的智慧交流,他们产生了一个新技...

    silvertheo 评论0 收藏0
  • javascript高级程序设计》第六章 读书笔记 之 javascript对象的几种创建方式

    摘要:三种使用构造函数创建对象的方法和的作用都是在某个特殊对象的作用域中调用函数。这种方式还支持向构造函数传递参数。叫法上把函数叫做构造函数,其他无区别适用情境可以在特殊的情况下用来为对象创建构造函数。 一、工厂模式 工厂模式:使用字面量和object构造函数会有很多重复代码,在此基础上改进showImg(https://segmentfault.com/img/bVbmKxb?w=456&...

    xiaotianyi 评论0 收藏0

发表评论

0条评论

ISherry

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<