JS constructor探讨(一):为什么要设置prototype.constructor?

本文探讨了JavaScript中构造函数的prototype属性与constructor属性的作用,分析了它们对原型链的影响,以及如何正确使用这些属性进行类型判断。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

每次实现JS的继承时,代码里必有如下两句:

//  用于设置原型
Employee.prototype = new Person()
//  设置原型的构造器
Employee.prototype.constructor=Employee

实现原型链就靠第一句话,但第二句话有什么用呢?

先看示例代码:

function Person(username) {
    this.username = username;
}
Person.prototype.setUsername = function(name) {
    this.username = name;
}
//  继承Person
function Employee(username, company) {
    Person.call(this, username);
    this.company = company;
}
//  设置原型
Employee.prototype = new Person()
Employee.prototype.constructor=Employee
//  测试代码
var yiifaa = new Employee('yiifaa', '360')

1. 会影响原型链吗?

其实可以很容易反证,如果影响原型链的话,constructor应该设置为Person才对,否则不就形成死循环了吗?

//  显然,prototype与constructor已经形成了双向联系
//  结果恒为真
Employee.prototype.constructor.prototype.constructor === Employee

建立原型链主要靠proto属性,如下:

//  显然,通过__proto__可以链接到原型的顶端
//  结果恒为真
Employee.prototype.__proto__ === Person.prototype
Person.prototype.__proto__ == Object.prototype

于是

//  一直获取到原型链的顶端
Employee.prototype.__proto__.__proto__  === Object.prototype

由上面的代码可以看出,constructor对原型链毫无影响。

2. 会影响instanceof吗?

经过测试,无论有没有设置prototype.constructor,以下恒为真

yiifaa instanceof Employee
yiifaa instanceof Person

所以对instanceof毫无影响,那好问题来了,如何改变instanceof的结果呢?方法如下:

Person.prototype = {}
//  现在为false
yiifaa instanceof Person

为什么呢?因为现在原型链的链已经断了,证明如下:

Employee.prototype.__proto__ !== Person.prototype

那怎么改回来呢?

Person.prototype = Employee.prototype.__proto__
//  现在测试恒为真
yiifaa instanceof Person

3. 会影响ownProperty吗?

显然,ownProperty只取决于构造函数,而不是构造函数的属性。

5. 最佳应用场景

于是constructor的最佳应用场景为类型判断,如下:

var arr = []
//  恒为真
arr.constructor === Array
var num = 2
//  恒为真
num.constructor === Number
var str = '123'
//  恒为真
str.constructor === String

6. 结论

prototype.constructor仅仅可以用于识别对象是由哪个构造函数初始化的,仅此而已。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值