javascript - 使用 Durandal 时查看模型继承

Question

我正在使用 Durandal 构建一个应用程序，我需要跨 View 模型共享一些功能。

我有 5 个屏幕要构建，它们几乎都是相同的屏幕，只是在激活函数中它们将调用不同的 api 端点，否则 View 和 View 模型将是相同的。

我是否应该遵循某种模式来正确构建它以促进代码重用？

Answer 1

如果 View 和 View 模型除了调用不同的 api 操作之外是相同的，那么将参数作为路由的一部分怎么样？然后在激活功能中，您可以打开参数。可以指定路由值，以便您的 url 是相关的，例如 [ http://site/page/subtype] ，其中 subtype 是参数(而不是使用数值)

关于继承，根据您需要的功能，JavaScript 继承的方式有很多种，可能有点让人困惑。 base2 和 Prototype 等库提供了一些功能齐全的继承模型。 John Resig also has an inheritance model我已经成功使用了。

一般来说，在涉及 JS 继承时，我更喜欢坚持更简单的解决方案。如果您需要几乎完整的继承功能集，那么这些库是不错的选择。如果您真的只关心从基类访问一组属性和函数，您可能只需将 View 模型定义为一个函数，然后用所需的基类替换函数的原型(prototype)就可以了。引用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();
});

请记住这个例子的所有结果实际上是一个单例(即你只会得到相同的实例，无论你 require() 它多少次)

如果你想要一个 transient (非单例)，只需返回 _ctor。然后，您需要在 require() 之后实例化一个新实例。

需要注意的是，一般来说，函数应该定义在原型(prototype)上，而不是构造函数本身。参见 this link for more information on why .因为这个例子只产生一个实例，所以它是一个有争议的问题，所以函数在构造函数中以提高可读性以及访问私有(private)变量和函数的能力。