Question

我最近一直在为很多项目使用Knockout.js，而且我正在写很多重复的代码。我希望能够定义一个BaseViewModel类，并让我的页面特定的ViewModel继承它。我有点困惑，如何做到这一点是Javascript。这是我的基本BaseViewModel：

(function (ko, undefined) {
    ko.BaseViewModel = function () {
        var self = this;
        self.items = ko.observable([]);
        self.newItem = {};
        self.dirtyItems = ko.computed(function () {
            return self.items().filter(function (item) {
                return item.dirtyFlag.isDirty();
            });
        });
        self.isDirty = ko.computed(function () {
            return self.dirtyItems().length > 0;
        });
        self.load = function () { }
    };
}(ko));

我希望能够在load中列出BaseViewModel等方法的签名，然后在继承的ViewModel中为它们提供定义。这有可能吗？我在网上找到了一些解决方案，但它们都依赖于定义函数/类来使继承工作。

Answer 1

由于您的BaseViewModel只是将所有属性/方法添加到this（而不是使用原型），因此非常简单：

在新视图模型中，只需致电BaseViewModel：

var MyVM = function () {
    var self = this;
    ko.BaseViewModel.call(self);

    self.somethingElse = ko.observable();
    self.itemCount = ko.computed(function() { return self.items().length; });
    self.items([1, 2, 3]); 
};


// ...
var vm = new MyVM();

Answer 2

Javascript继承分为两部分。第一个是构造函数，第二个是原型（你没有使用，所以你可以跳过）。

var ViewModel = function(data) {
    BaseViewModel.call(this);
};
//you only need to do this if you are adding prototype properties
ViewModel.prototype = new BaseViewModel();

关于覆盖load的最后一点，与你的viewmodel正常放置load函数没什么不同。 Javascript允许你用任何东西覆盖任何对象属性，这里没有特殊的步骤。

这是fiddle demonstrating继承。

Knockout ViewModel基类，Javascript继承

2 个答案: