JavaScript 使用和不使用原型的继承

Question

你能解释一下为什么有必要（或建议）在 JavaScript 继承中使用“__proto__”和“原型”吗？这里有两个代码示例，使用和不使用原型它们的结果似乎完全相同。两种情况下的结果如下：

"elephant is walking to melbourne"

"sparrow is walking to sydney"

"sparrow is flying to melbourne"

示例一：

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

Animal.prototype.walk = function (destination) {
    console.log(this.name, 'is walking to', destination);
};

var animal = new Animal('elephant');
animal.walk('melbourne');

function Bird(name) {
    Animal.call(this, name);
}

Bird.prototype.__proto__ = Animal.prototype;

Bird.prototype.fly = function (destination) {
    console.log(this.name, 'is flying to', destination);
}

var bird = new Bird('sparrow');
bird.walk('sydney');
bird.fly('melbourne');

例子二：

function Animal(name) {
    this.name = name;
 
 this.walk = function (destination) {
  console.log(this.name, 'is walking to', destination);
 };
}

var animal = new Animal('elephant');
animal.walk('melbourne');

function Bird(name) {
    Animal.call(this, name);
 
 this.fly = function (destination) {
  console.log(this.name, 'is flying to', destination);
 }
}

var bird = new Bird('sparrow');
bird.walk('sydney');
bird.fly('melbourne');

例如为什么 "Bird.prototype.fly = function..." 在 Bird 函数中比简单的 "this.fly = function..." 更好？

Answer 1

我认为这应该很清楚了。我已经把动物从剧本中去掉了（呃……字面意思）。

function Bird(name) {
    this.name = name;
    this.fly = function (destination) {
        console.log(this.name, 'is flying to', destination);
    }
}

var bird = new Bird('sparrow');
bird.fly('Melbourne');
bird.fly = function (destination) {
    console.log(this.name, 'is taking the plane to', destination);
}
bird.fly('Melbourne');

var bird2 = new Bird('eagle');
bird2.fly('Melbourne');

这给出了

sparrow is flying to Melbourne

sparrow is taking the plane to Melbourne

eagle is flying to Melbourne

对比

function Bird(name) {
    this.name = name;
}
Bird.prototype.fly = function (destination) {
    console.log(this.name, 'is flying to', destination);
}

var bird = new Bird('sparrow');
bird.fly('Melbourne');
Bird.prototype.fly = function (destination) {
    console.log(this.name, 'is taking the plane to', destination);
}
bird.fly('Melbourne');

var bird2 = new Bird('eagle');
bird2.fly('Melbourne');

这给出了

sparrow is flying to Melbourne

sparrow is taking the plane to Melbourne

eagle is taking the plane to Melbourne

在第一种情况下，您正在修改该对象的飞行功能。在第二种情况下，您正在修改一个公共共享函数（来自原型）

由于您主要希望函数通用（并且数据分开），因此通常使用 Bird.prototype...

JavaScript 使用和不使用原型的继承

JavaScript inheritance with and without using of prototype

javascript

inheritance

prototype

prototypal-inheritance