javascript - Javascript 中的原型(prototype)链未更新

Question

我试图理解 Javascript 中的原型(prototype)继承，但无法应用于以下情况。任何帮助将不胜感激。

我正在定义一个构造函数，如下所示:

var base = function() {
    var priv = "private"; // Private
    var publ = "public";  // Public through a getter/setter (below)

    // The object to return
    var f = {};

    f.publ = function (new_val) {
        if (!arguments.length) {
          return publ;
        }
        publ = new_val;
        return f;
    };

    return f;
};

有了这个构造函数，我可以通过调用 base(); 创建对象。这些对象有一个公共(public)方法 (publ)。

现在，按照相同的结构，我想要一个新的构造函数来创建继承自上面定义的“基本构造函数”创建的对象的对象:

var myclass = function () {

  // Other parameters defined here

  var f = function () {
      // publ is inherited
      console.log(f.publ());
  };

  // Trying to set the prototype of f to the object created by "base()"
  f.prototype = base();

  // Other methods defined here

  return f;
};

使用 f.prototype = base(); 我想让 f 继承 base() 返回的对象中定义的所有方法，但试图调用 f.publ 报错，因为 f 没有方法 publ

欢迎任何帮助理解正在发生的事情

M;

Answer 1

最常见的原型(prototype)继承方式如下:

function Base() {
    var priv = "private";
    this.publ = "public";
}

您现在可以使用 new Base 创建 Base 的实例。接下来我们创建 MyClass:

MyClass.prototype = new Base;

function MyClass() {
    alert(this.publ);
}

最后，您可以使用 new MyClass 创建 MyClass 的实例，如下所示:

var a = new MyClass; // alerts "public"

亲自观看演示:http://jsfiddle.net/b3QyE/

---

JavaScript 中的原型(prototype)继承可能会有点困惑，因为它是 constructor-centric instead of prototype-centric这就是为什么我更喜欢使用以下实用函数来创建“类”:

function defclass(base, body) {
    var uber = base.prototype;
    var prototype = Object.create(uber);
    var constructor = (body.call(prototype, uber), prototype.constructor);
    constructor.prototype = prototype;
    return constructor;
}

使用 defclass，您现在可以按如下方式重组代码:

var Base = defclass(Object, function () {
    this.constructor = function () {
        var priv = "private";
        this.publ = "public";
    };
});

var MyClass = defclass(Base, function (uber) {
    this.constructor = function () {
        uber.constructor.call(this);
        alert(this.publ);
    };
});

它更具可读性和易懂性。一切都封装在一个单一的功能范围内，没有什么悬而未决的地方。此外，您无需了解原型(prototype)继承即可使用它。请参阅更新的演示:http://jsfiddle.net/b3QyE/2/

如果您注意到我们正在从 MyClass 构造函数调用 Base 类构造函数。这允许您使用 Base 类构造函数初始化实例。您可以通过 uber 调用 Base 类的任何方法。

---

要了解有关原型(prototype)继承的更多信息，请查看以下答案:

1. JavaScript inheritance and the constructor property
2. How to achieve pseudo-classical inheritance right on the class declaration?
3. Benefits of prototypal inheritance over classical?