为什么我的子类不从 Javascript 中的父类继承属性？

Question

我正在尝试了解 Javascript 的原型继承模型，但似乎缺少一些东西。我创建了以下一组对象：

function Dog() {
  this.legs = 4;
  this.arms = 0;
}

Dog.prototype.describe = function() {
  console.log("Has " + this.legs + " legs and " + this.arms + " arms");
}

function Schnauzer(name) {
  Dog.call(this);
  this.name = name;
}

Schnauzer.prototype.describe = function() {
  console.log(this.name + " is a Schnauzer with a shaggy beard");
  Dog.prototype.describe(this);
}

var my_dog = new Schnauzer("Rupert");
my_dog.describe();

我的期望是这会输出：

Rupert is a Schnauzer with a shaggy beard
Has 4 legs and 0 arms

但这是我实际得到的：

Rupert is a Schnauzer with a shaggy beard
Has undefined legs and undefined arms

Answer 1

有

Dog.prototype.describe(this);

您正在使用Dog.prototype 的调用上下文（this 值）调用describe 方法，并将狗实例作为第一个参数传递。但是describe 不接受任何参数，它会尝试从this 获取属性。

改为使用Dog.prototype.describe.call(this);，以使用狗实例的this 值调用方法：

function Dog() {
  this.legs = 4;
  this.arms = 0;
}

Dog.prototype.describe = function() {
  console.log("Has " + this.legs + " legs and " + this.arms + " arms");
}

function Schnauzer(name) {
  Dog.call(this);
  this.name = name;
}

Schnauzer.prototype.describe = function() {
  console.log(this.name + " is a Schnauzer with a shaggy beard");
  Dog.prototype.describe.call(this);
}

var my_dog = new Schnauzer("Rupert");
my_dog.describe();

不过，这有点难看，因为您必须使用 .call 才能获得一个在正常情况下会在当前对象的原型链上更高的方法。如果可能，您可以考虑重新命名您的 Schnauzer.prototype.describe 方法，这样它就不会掩盖 Dog.prototype 方法：

function Dog() {
  this.legs = 4;
  this.arms = 0;
}

Dog.prototype.describe = function() {
  console.log("Has " + this.legs + " legs and " + this.arms + " arms");
}

function Schnauzer(name) {
  Dog.call(this);
  this.name = name;
}
Schnauzer.prototype = Object.create(Dog.prototype);

Schnauzer.prototype.describeSchnauzer = function() {
  console.log(this.name + " is a Schnauzer with a shaggy beard");
  this.describe();
}

var my_dog = new Schnauzer("Rupert");
my_dog.describeSchnauzer();

或者使用class语法和super：

class Dog {
  legs = 4;
  arms = 0;
  describe() {
    console.log("Has " + this.legs + " legs and " + this.arms + " arms");
  }
}

class Schnauzer extends Dog {
  constructor(name) {
    super();
    this.name = name;
  }
  describe() {
    console.log(this.name + " is a Schnauzer with a shaggy beard");
    super.describe();
  }
}

var my_dog = new Schnauzer("Rupert");
my_dog.describe();