JavaScript原型继承[重复]

Question

下面是一个简单的 JavaScript 继承示例。我们可以替换以下行：Dog.prototype = new Animal();
与 Dog.prototype = Animal.prototype？

我在浏览器中进行了测试，他们给了我相同的结果。我很奇怪为什么我们需要创建一个新的 Animal 对象并将其分配给 Dog.prototype。

function Animal(age){
    this.age = age;
}

Animal.prototype.walk = function(){
     console.log("Walk"); 
}

function Dog(color, age){
    this.color = color;
    Animal.call(this, age)
}

Dog.prototype = new Animal();      //Why not Dog.prototype = Animal.prototype
Dog.prototype.constructor = Dog;


dog_b = new Dog("yellow", 9);
console.log("Age: " + dog_b.age +  " Color: " + dog_b.color );
dog_b.walk()

Answer 1

在这种特殊情况下，您可以出于简单的原因替换这些行：

function Dog(color, age) {
    this.color = color;
    Animal.call(this, age); // This line
}

在这里，您使用call 调用Animal 的构造函数，并提供this 从而手动建立Animal 的上下文。因此，function Animal 中的this 将始终引用Dog 的对象。这就是为什么 new 根本不会产生影响的原因。

严格来说，您实际上并没有进行适当的原型继承。您可以通过以下方式确认：

dog_b.hasOwnProperty('age'); // => true

这实际上称为constructor stealing，其中Dog 窃取Animal 的构造函数。 walk 方法虽然在 Animal 的 ctor 上。

这意味着age 属性位于Dog 本身而不是Animal。这是为什么？同样，因为您手动将 Animal 的构造函数上下文建立为 Dog 的构造函数上下文。

编辑：

在 Javascript 中有多种描述和实现继承的方法，由于这里不是写书的地方，所以我会很快。

你正在做的事情叫做Parasitic Combination Inheritance（你不必记住这个词）。这没有错，它只是获得继承的另一种方式（这只是Animal.prototype 上的函数的原型）。如果它对你有用，我会说接受它。如果你真的想让Animal 的age 在Animal 上，那么在使用构造函数获取继承时会遇到问题。

这样做的一种方法是：

function inherit(o){
    function F(){}
    F.prototype = o;
    return new F();
}

var foo = {
    name: 'some'
}

var bar = inherit(foo); // bar.name refers to the object on foo

如您所见，原型继承通常用于对象字面量（想想 Angular 的作用域对象）。