Backboneで多重継承を実現する

やりたいこと

Viewとか、Modelとか、機能に意味を持たせて開発をしていたときに、複合した機能を持つ具象クラスを作りたくなった。

　Backboneのextendメソッドは、親→子の単一継承をサポートするのみです。例えば以下です。

var extendedModel = Backbone.Model.extend({
    parse: function(hoge){
        console.log("parse!");
        return hoge;
    }
});

　しかし、Javaのインターフェースのように、複数のクラスを継承したい場合に、以下のようにしたくてもうまくいきません。

var extendedModelA = Backbone.Model.extend({
    parse: function(hoge){
        console.log("parse!");
        return hoge;
    }
});


var extendedModelB = Backbone.Model.extend({
    url: function(hoge){
        console.log("url!");
        return "..."
    }
});


var model = extendedModelA.extend(extendedModelB);  // error

　どうしても、model.fetch時に以下のようなログを吐きたい！

url!
parse!

解決策

オブジェクトを順に継承していく

　単純明快。

var modelObjectA = {
    parse: function(hoge){
        console.log("parse!");
        return hoge;
    }
};

var modelObjectB = {
    url: function(hoge){
        console.log("url!");
        return "..."
    }
};

var model = Backbone.Model.extend(modelObjectA).extend(modelObjectB);

prototypeを継承する

　以下のような方法もあります。場合によってはmodelObjectの継承よりもわかりやすくなります。

var extendedModelA = Backbone.Model.extend({
    parse: function(hoge){
        console.log("parse!");
        return hoge;
    }
});


var extendedModelB = Backbone.Model.extend({
    url: function(hoge){
        console.log("url!");
        return "..."
    }
});


var model = extendedModelA.extend(extendedModelB.prototype);