Ja vaScript 中原型对象的 constructor 属性默认指向构造函数本身，但它很容易被意外覆盖或丢失，尤其是在手动修改 prototype 时。

之所以会出现 constructor 丢失，根源就在于：一旦用字面量把 prototype 整体重写掉，新生成的那个原型对象本身就不再带有该属性了。这样一来，沿着原型链继续往上找，最终拿到的就会是 Object.prototype.constructor。

解决办法其实很直接：手动把指向补回来即可，比如 MyClass.prototype.constructor = MyClass;；如果还想把属性描述控制得更细，也可以用 Object.defineProperty 来设置。

至于 ES6 的 class，constructor 会由语言层自动维护，通常不需要再额外处理。

为什么 constructor 会丢失？

当你用字面量方式重写构造函数的 prototype，比如 Foo.prototype = { ... }，新对象本身没有 constructor 属性。

这时它会沿原型链继续向上查找，最终找到 Object.prototype.constructor，也就是 Object，从而导致指向错误。

如何正确设置 constructor 指向？

在替换原型对象后，需要手动把 constructor 指回原构造函数。

• 直接赋值：MyClass.prototype.constructor = MyClass;
• 使用 Object.defineProperty：可以更规范地控制属性特性。

Object.defineProperty(MyClass.prototype, 'constructor', {
  value: MyClass,
  enumerable: false,
  writable: true,
  configurable: true
});

ES6 类中的 constructor 情况

使用 class 声明时，类体内的 constructor 方法会自动成为原型的 constructor。

它通常是不可枚举、不可删除的。虽然你不能直接改 MyClass.prototype.constructor 的值，但它始终指向该类，一般无需额外处理。

实际开发中要注意什么？

现在的大多数现代工具链，比如 Babel，在编译类的时候，通常都会顺手把 constructor 修正好。

不过，如果是手动写继承、直接用 Object.create()，或者对原型做了深拷贝，这一步就不能想当然，最好自己核对一遍并补上。

怎么确认有没有配对正确？可以用 instance.constructor === MyConstructor 检查一下，基本就清楚了。

《夸克》非常好用的免费AI浏览器

下载APP查看