JavaScript - 特殊的多重继承

Question

假设我有以下对象类型:

var Positionable = function() { };
Positionable.prototype.x = 0;
Positionable.prototype.y = 0;

var Sizable = function() { };
Sizable.prototype.w = 0;
Sizable.prototype.h = 0;

var Fadable = function() { };
Fadable.prototype.a = 0;

我希望有一个函数允许我创建一个子类型，该子类型将从其他几个类型继承。例如，我可以创建一个 Rectangle 类型，它会继承 Positionnable 和 Sizable。

我可以链接原型(prototype):

var Rectangle = function() { };
Sizable.prototype = new Positionable;
Rectangle.prototype = new Sizable;

但我不喜欢这种方法有两个原因:

• 它导致 Sizable 继承自 Positionable，这意味着如果我想要另一个类型是 Sizable 而不是 Positionable，我不能这样做；

• 这意味着 Sizable 对象也是 Positionnable，这在语义上并不好，因为没有理由要 Sizable 对象是 Positionnable 而不是其他方式。

所以我首先想到了合并原型(prototype)，假设我有一个函数 void merge( type dst, type src, bool overwrite )，在循环中我会简单地将每个基类原型(prototype)合并到子类型中原型(prototype)。这不会创建一个链(这是我上面解释的想要的)

但这会导致另一个问题:因为我没有使用 new，所以不会调用基本构造函数。所以我想知道，有没有办法也合并构造函数？例如，如果我可以访问和引用基本构造函数，我可以将这些基本构造函数中的每一个存储在一个数组中，并为子类型构造函数分配一个连续调用这些构造函数的函数。

我怎么能用构造函数做到这一点？或者也许还有另一种方法？

感谢您的帮助!

Answer 1

由于 JavaScript 不支持多重继承，您必须解析为 mixins .就像你说的，你必须将其中一个原型(prototype)的方法复制到子原型(prototype)。

构造函数应该在子构造函数内部调用。这是一个例子:

var Rectangle = function() {
    Sizeable.call(this);
    Positionnable.call(this);
};
// Rectangle inherits from Sizeable
Rectangle.prototype = Object.create(Sizeable.prototype);
// Mixin Positionnable
merge(Rectangle.prototype, Positionnable.prototype);

// alternatively you could mixin both of the prototypes

另请参阅:Benefits of using `Object.create` for inheritance

---

function mixin(Target) {
    var args = arguments;

    // merge prototypes
    for(var i = 1; i < args.length; i++) {
        merge(Target.prototype, args[i].prototype);
    }

    // a new constructor function which calls all 
    // the passed constructor functions
    var F = function() {
        var instance = Target.apply(this, arguments);
        for (var i = 1; i < args.length; i++) {
            args[i].call(instance);
        }
        return instance;
    };
    F.prototype = Target.prototype;
    return F;
};

// usage

Rectangle = mixin(Rectangle, Sizeable, Positionnable);

这在一个假设下起作用:mixin 构造函数不期望任何参数。如果必须向它们传递参数，则必须在目标/子构造函数中显式调用它们。