バックボーンビューの継承

Question

私はこのような3バックボーンの景色を眺めることができます：

ParentView = Backbone.View.extend({ 
    addUsers : function() 
    { 
     console.log("Parent's Add User"); 
    }, 

    addProject : function() 
    { 
     console.log("Parent's Add Project"); 
    } 
}); 

ChildView = ParentView.extend({ 
    addProject : function() 
    { 
     var self = this; 

     console.log("Child's add Project"); 

     self.constructor.__super__.addProject.apply(self); 
    } 
}); 

GrandChildView = ChildView.extend({ 
    addItem : function() 
    { 
     var self = this; 
     self.addProject(); 
    }, 

    addUsers : function() 
    { 
     var self = this; 
     console.log("Grand Child's Add users"); 
     self.constructor.__super__.addUsers.apply(self); 
    } 
}); 

var vChild = new ChildView(); 
vChild.addProject(); // works fine, by calling it own and parent's functions. 

var vGrandChild = new GrandChildView(); 
vGrandChild.addUsers(); // This throws Maximum call stack size exceeded error, 

私はGrandChildViewの新しいインスタンスを作成し、そのADDUSERSメソッドを呼び出し、それは私はそれがbecuaseさを推測、最大スタックサイズを超えスローそれは自分自身を呼び出し続けます。把握することができませんでした。 理由はスーパーのメソッドを呼び出すようだ。

ありがとうございます。

Answer 1

は確かに無限ループに「孫」ビューを呼んでいる:)

ヒントを呼び出します

ParentView = Backbone.View.extend({ 
    addUsers : function() 
    { 
     console.log("Parent's Add User"); 
    }, 

    addProject : function() 
    { 
     console.log("Parent's Add Project"); 
    } 
}); 

ChildView = ParentView.extend({ 
    addProject : function() 
    { 
     console.log("Child's add Project"); 

     ParentView.prototype.addProject.call(this); 
    } 
}); 

GrandChildView = ChildView.extend({ 

    addItem : function() 
    { 
     this.addProject(); 
    }, 

    addUsers : function() 
    { 
     console.log("Grand Child's Add users"); 
     ChildView.prototype.addUsers.call(this); 
    } 
}); 

var vChild = new ChildView(); 
vChild.addProject(); // works fine, by calling it own and parent's functions. 

var vGrandChild = new GrandChildView(); 
vGrandChild.addUsers(); 

Answer 2

だけ試みのために：あなたのChildViewにこれを追加します。

addUsers : function() 
{ 
    var self = this; 
    console.log("Child's Add users"); 
    self.constructor.__super__.addUsers.apply(self); 
} 

たぶんaddUsers機能が正しくChildView.prototypeで定義されていないが、それはは、それが見つからないを受け継いで、self.prototypeに中継されます。私は知らない..私はJSが継承を共通に使用することを意味しているとは思わない。OO指向言語。それは価値がある：あなたが実際にあなたが実際にあなたの関数の手順に従った場合、あなたが理解できるはずである、やっている

Answer 3

私は、あなたのコードを取ったのCoffeeScriptに変換し、それを与えた：）

それ以外の場合、これはあなたが達成するために何を意味するかおそらく、あなたはapply ....としてthisが毎回あるものを考えて運動私はこれ私にとってうまくいくJavaScript：

var ChildView, GrandChildView, ParentView, 
    __hasProp = {}.hasOwnProperty, 
    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor; child.__super__ = parent.prototype; return child; }, 
    __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; }; 

ParentView = (function(_super) { 

    __extends(ParentView, _super); 

    ParentView.name = 'ParentView'; 

    function ParentView() { 
    return ParentView.__super__.constructor.apply(this, arguments); 
    } 

    ParentView.prototype.addUsers = function() { 
    return console.log("Parent's Add User"); 
    }; 

    ParentView.prototype.addProject = function() { 
    return console.log("Parent's Add Project"); 
    }; 

    return ParentView; 

})(Backbone.View); 

ChildView = (function(_super) { 

    __extends(ChildView, _super); 

    ChildView.name = 'ChildView'; 

    function ChildView() { 
    this.addProject = __bind(this.addProject, this); 
    return ChildView.__super__.constructor.apply(this, arguments); 
    } 

    ChildView.prototype.addProject = function() { 
    console.log("Child's add Project"); 
    return ChildView.__super__.addProject.apply(this, arguments); 
    }; 

    return ChildView; 

})(ParentView); 

GrandChildView = (function(_super) { 

    __extends(GrandChildView, _super); 

    GrandChildView.name = 'GrandChildView'; 

    function GrandChildView() { 
    this.addUsers = __bind(this.addUsers, this); 

    this.addItem = __bind(this.addItem, this); 
    return GrandChildView.__super__.constructor.apply(this, arguments); 
    } 

    GrandChildView.prototype.addItem = function() { 
    return this.addProject(); 
    }; 

    GrandChildView.prototype.addUsers = function() { 
    console.log("Grand Child's Add users"); 
    return GrandChildView.__super__.addUsers.apply(this, arguments); 
    }; 

    return GrandChildView; 

})(ChildView); 

私の理解から、難しい点は、これを機能内で自己に縛っていることです。これは、あなたがあなたが省略しようとしているものである、関数を呼び出すコンテキストで関数を呼び出すたびに発生します。これは通常、コールバックのためだけに、または関数を呼び出すオブジェクトへの参照がない場合にのみ、関数の参照をバインドする必要があります。あなたがこのような状況のためにこれを束縛する必要があるならば、それは関数の外で行います。