JavaScript类继承死循环

Question

我有以下内容:

function Person() {
  console.log('person');
}

function Player() {
  this.personConstructor();
}

Player.prototype = Person.prototype;
Player.prototype.constructor = Player;
Player.prototype.personConstructor = Person.prototype.constructor;

new Player();

目的是从 Person 继承到 Player 然后让新的子类调用父类的原始构造函数。但是，这会导致无限循环。我做错了什么，为什么会发生循环？

Answer 1

这里的这一行是你的问题:

Player.prototype = Person.prototype;

您希望 Player 的原型(prototype)继承 Person 的原型(prototype)，但不使它们相等.目前，您的代码使 Player 和 Person 原型(prototype)引用相同，因此对 Player.prototype 的任何更改也会影响Person.prototype(有效地使它们无法区分)。

您正在寻找:

Player.prototype = Object.create(Person.prototype);

Object.create用给定的原型(prototype)实例化一个新对象，没有实际调用构造函数(不像常规的 new Person() 调用那样)。这允许您获得一个继承 Person 原型(prototype)的新对象，然后您可以针对 Player 的细节对其进行修改。

编辑:正如 Siddarth 在评论中所建议的那样，更好的解决方案是通过 property descriptor 设置 constructor :

Player.prototype = Object.create(Person.prototype, {
    constructor: { value: Player }
});

这样，新创建的原型(prototype)的 constructor 属性将变为不可配置、不可枚举和不可写。这可以防止您之后通过赋值意外更改它(例如 Player.prototype.constructor = Foo)并且它不会出现在 Object.keys 或 中>for..in 循环。通常，这应该无关紧要，但这是一个很好的做法。