javascript - 关于 Knockout.js 和范围的菜鸟问题

Question

按照文档进行操作，尝试了我自己的操作并遇到了一些问题。

initializeViewModel = function(){

    var listing_model = {
        sale_rent: ko.observable( jQuery('#id_sale_rent')),
        property_type: ko.observable( jQuery('#id_property_type').val()),
        address: ko.observable( jQuery('#id_address')),
        is_condo: ko.computed(function(){
            return this.property_type() == 'condominium';
        }, this)
    };



    listing_model.district = ko.computed(function(){

        return this.district() || this.property_type();
    }, listing_model);

    return listing_model;
}

声明return this.property_type() == 'condominium';导致异常object <object> has no method property_type() 。我认为这可能是一个范围问题，但是this似乎在这里指的是正确的实例。有人可以指出我的问题吗？

Answer 1

最干净的解决方案是使用匿名函数(创建闭包)而不是普通对象:

initializeViewModel = function(){
    var listing_model = new function() {
        // Close-in a reference to this object
        var self = this;

        self.sale_rent = ko.observable( jQuery('#id_sale_rent') );
        self.property_type = ko.observable( jQuery('#id_property_type').val() );
        self.address = ko.observable( jQuery('#id_address') );

        self.is_condo = ko.computed(function() {
            return (self.property_type() == 'condominium');
        });
    }();

    // ...

否则，函数内的“this”(定义计算)指的是您作为第二个参数传递给 ko.compulated() 的任何内容 - “this”的值是“initializeViewModel”的当前上下文"被执行，因此如果您照常调用该函数(即 initializeViewModel())，“this”将只是对全局对象的引用，而不是对“listing_model”的引用(如预期的那样)/意图)。

手册中的示例与您的代码不同:您立即创建一个普通对象，而在手册中，所有内容都包装在函数中。使用“new”关键字调用该函数会创建一个新对象并将上下文(“this”)设置为此对象。这就是他们的代码有效的原因。