JavaScript - 构造函数中的继承

Question

对于一个 JavaScript 项目，我们希望引入对象继承来减少代码重复。但是，我不能完全按照我想要的方式运行它，需要一些帮助。

我们使用模块模式。假设有一个超级元素：

a.namespace('a.elements.Element');
a.elements.Element = (function() {
    // public API -- constructor
    Element = function(properties) {
        this.id = properties.id;
    };

    // public API -- prototype
    Element.prototype = {
        getID: function() {
            return this.id;
        }
    };

    return Element;
}());

还有一个继承自这个超级元素的元素：

a.namespace('a.elements.SubElement');
a.elements.SubElement = (function() {
    // public API -- constructor
    SubElement = function(properties) {
        // inheritance happens here
        // ???
        this.color = properties.color;
        this.bogus = this.id + 1;
    };

    // public API -- prototype
    SubElement.prototype = {
        getColor: function() {
            return this.color;
        }
    };

    return SubElement;
}());

您会注意到我不太确定如何实现继承本身。在构造函数中，我必须能够将参数传递给超级对象构造函数并创建一个超级元素，然后用于创建继承的元素。我需要一种（舒适的）可能性来访问新对象的构造函数中的超级对象的属性。理想情况下，我可以对超级对象进行操作，就好像它是新对象的一部分一样。

我还希望能够创建一个新的 SubElement 并在其上调用 getID()。

我想要完成的似乎是传统的基于类的继承。但是，我想使用原型继承来做到这一点，因为那是 JavaScript 方式。这甚至可行吗？

提前致谢！

编辑：修复了 cmets 中建议的私有变量的使用。 EDIT2：代码的另一个更改：重要的是id 可以从SubElement 的构造函数中访问。

Answer 1

如果您愿意，您可以使用 JavaScript 的原型继承来进行类类继承。 See this other answer 获取完整示例和讨论，您可以轻松地将其融入您的模式。

Answer 2

试试这段代码（继承方法取自here）：

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

a.namespace('a.elements.SubElement');
a.elements.SubElement = (function() {
    // private properties
    var color;

    // public API -- constructor
    SubElement = function(properties) {
        color = properties.color;
    };

    //inherit from parent
    SubElement.prototype = inherit(a.elements.Element);

    //add new methods to the prototype

    SubElement.prototype.getColor = function() {
            return color;
    }

    SubElement.prototype.doSomethinkWithID = function() {
            var id = this.getID();
    }

    return SubElement;
}());