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的方式。这甚至可行吗？

提前致谢！

编辑：修正了评论中建议的私有变量的使用。 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;
}());

JavaScript - 构造函数中的继承

2 个答案: