骨幹組件的可重用性

Question

我試圖找到最好的選項，使骨幹視圖可重用。我瞪着眼睛，發現了許多不同的解決方案，但不確定哪一個適合我的要求。基本上，我要去填補與實時數據的許多部件，我需要一個基本組件，將處理服務訂閱

是繼針對此問題最好的解決辦法：

App.View.Base = Backbone.View.extend({ 
    baseMethod: function(params) {}; 
}); 

App.ExtendedView.Base = App.View.Base.extend({ 
    // new stuff here 

    // overriding App.View.Base.baseMethod 
    baseMethod: function(params) { 
    // overriding stuff here 
    App.View.Base.prototype.baseMethod.call(this, params); // calling super.baseMethod() 
    } 
}); 

有沒有更好的方法嗎？或者我應該使用mixins？

Answer 1

我可能會傾向於在這裏偏向於繼承組成，並創建一個旋轉視圖，並使用它的實例在需要微調功能的其他意見。

更多信息：Prefer composition over inheritance?

Answer 2

典型的規則的拇指我用這樣的是，如果有在基類中的任何一成不變的方法，以便爲您的所有子類共同的背景，然後繼承的東西說得通。舉例來說，我已經創建了我的骨幹網應用基本視點類，它看起來是這樣的：

define(function() { 
    return Backbone.View.extend({ 
     /** 
     * show() and hide() are immutable 
     */ 
     show : function() { 
      this.beforeShow(); 
      this.doShow(); 
      this.afterShow(); 
     }, 
     hide : function() { 
      this.beforeHide(); 
      this.doHide(); 
      this.afterHide(); 
     }, 
     doShow : function() { 
      this.$el.show(); 
      this.trigger('displayComplete', {action : 'show'}); 
     }, 
     doHide : function() { 
      this.$el.hide(); 
     }, 
     //Override the following to extend behavior of the view 
     //before and/or after the view is shown/hidden.    
     beforeShow : function() {}, 
     beforeHide : function() {}, 
     afterShow : function() {}, 
     afterHide : function() {} 
    }); 
}); 

這是一個非常簡單的例子，但它已被證明刁難我的應用程序的開發變得更加容易，因爲我的中央控制器對象具有顯示和隱藏視圖的通用界面。我想你也可以在這裏使用組合，但是這需要在運行時進行顯式擴展（）。在任何一種情況下，您都會得到相同的結果，但我只是在實例化視圖時喜歡使用該功能。

另一個想法是，它確實取決於你想完成什麼。繼承比組合更嚴格，但它又取決於你最終想要完成什麼，有時強化維持一個上下文是一件好事。