JavaScript 中的原型继承

Question

我一直在 YUI Theater 观看 Douglas Crockford 的演讲，我有一个关于 JavaScript 继承的问题...

Douglas 给出了这个例子来表明“Hoozit”继承自“Gizmo”：

function Hoozit(id) {
    this.id = id;
}
Hoozit.prototype = new Gizmo();
Hoozit.prototype.test = function (id) {
    return this.id === id;
};

为什么他写 Hoozit.prototype = new Gizmo() 而不是 Hoozit.prototype = Gizmo.prototype？

这两者有什么区别吗？

Answer 1

原因是使用 Hoozit.prototype = Gizmo.prototype 意味着修改 Hoozit 的原型对象也会修改 Gizmo 类型的对象，这不是预期的行为。

Hoozit.prototype = new Gizmo() 继承自 Gizmo，然后单独保留 Gizmo。

Answer 2

其他答案解决了这个问题，但如果你确实想继承原型，你可以使用一些寄生魔法：

Object.prototype.inherit = function(p) {
    NewObj = function(){};
    NewObj.prototype = p;
    return new NewObj(); 
};

// Paraphrasing of Nicholas Zakas's Prototype Inheritance helper
function inheritPrototype(subType, superType) {
    var prototype = Object.inherit(superType.prototype);
    prototype.constructor = subType;
    subType.prototype = prototype;
};

现在你可以替换：

Hoozit.prototype = new Gizmo();

与

inheritPrototype(Hoozit, Gizmo);

它可能不值得麻烦，除非你有一个真正的大Gizmo构造函数（唯一的胜利我的建议是你不必调用 Gizmo 的构造函数来连接原型）。 我在 TDD JavaScript Examples。

Answer 3

如果他写成 Hoozit.prototype = Gizmo.prototype ，那么他以后对 Hoozit 原型所做的任何修改都会反映在 Gizmo 原型中。

Answer 4

除了 Triptych 的回答之外：Hoozit 实例还将继承 Gizmo 的所有实例属性，而不仅仅是原型中定义的属性； 例如：

function Gizmo() {
    this.foo = 'bar'; // foo is visible in every Hoozit instance
}