查看使用Durandal時的模型繼承

Question

我正在構建使用Durandal的應用程序，並且我需要跨視圖模型共享一些功能。

我有5個屏幕來構建，它們幾乎都是相同的屏幕，除了在激活功能中它們會調用不同的api端點，否則視圖和視圖模型將是相同的。

有沒有一種模式，我應該遵循正確的結構來促進代碼重用？

Answer 1

如果視圖和視圖模型除了調用不同的api動作之外都是相同的，那麼只需將一個參數作爲路徑的一部分？然後在激活功能中，可以打開參數。路由值可以被指定爲使得你的url是相關的，例如[http://site/page/subtype]，其中子類型是參數（而不是使用數值）

關於繼承，取決於你需要的功能，有很多方法可以做JavaScript繼承可能會有點混亂。有些庫提供了一些全功能的繼承模型，如base2和Prototype。我已經成功地使用了John Resig also has an inheritance model。

一般來說，當談到JS繼承時，我更願意堅持更簡單的解決方案。如果你需要一套完整的繼承功能，那麼這些庫是很好考慮的。如果您真的只關心從基類訪問一組屬性和函數，您可能只需將視圖模型定義爲一個函數，並將函數的原型替換爲所需的基類即可。有關繼承的詳細信息，請參閱Mozilla's Developer Docs。

這裏有一個例子：

//viewModelBase 
define(function (require) { 
    "use strict"; 

    function _ctor() { 

     var baseProperty = "Hello from base"; 
     function baseFunction() { 
      console.log("Hello from base function"); 
     } 
     //exports 
     this.baseProperty = baseProperty; 
     this.baseFunction = baseFunction; 
    }; 

    //return an instance of the view model (singleton) 
    return new _ctor(); 
}); 

//view model that inherits from viewModelBase 
define(function (require) { 
    "use strict"; 

    function _ctor() { 

     var property1 = "my property value"; 
     function activate() { 
      //add start up logic here, and return true, false, or a promise() 
      return true; 
     } 
     //exports 
     this.activate = activate; 
     this.property1 = property1; 
    }; 

    //set the "base" 
    var _base = require("viewModelBase"); 
    _ctor.prototype = _base; 
    _ctor.prototype.constructor = _ctor; 

    //return an instance of the view model (singleton) 
    return new _ctor(); 
}); 

請記住這個例子中的所有結果在什麼是一個有效的單（即你只能得到相同的實例，無論多少次，你需要（）的話）

如果你想要一個瞬態（非單態）只返回_ctor。然後你需要在需要（）的時候實例化一個新的實例。

還有一點需要注意，一般來說，函數應該在原型上定義，而不是在構造函數本身中定義。見this link for more information on why。因爲這個例子只產生一個實例，所以這是一個有爭議的問題，所以這些函數在構造函數內部，以提高可讀性，並且還能夠訪問私有變量和函數。