Question

我们有一个JS框架，可以让我们设置“模块”。通过调用addModule方法并传递包含有关模块的必需属性的文字对象以及可选方法来添加每个模块。例如：

framework.addModule({

    id: "test-module",
    init: function () {
        //stuff to do when initializing like set up jQuery bindings

        $("div").click(function () {
            // need access to literal object so I can call:
            something.utility1();
        });

    },

    utility1: function () {
        something.utility2();
    },

    utility2: function () {
      // need access to literal object so I can call:
    }

});

我正在尝试找出最简单的方法，使对象本身可用于对象内部的任何级别的任何代码（代替“某事”）。

我能做的最好的事情是向对象添加this: this属性，然后在我可以放置var module = this的方法内部，这可以工作，但需要将变量添加到每个模块。我想看看是否有另一种方法不需要为每个方法添加变量。感谢。

感谢您的评论和zzzzBov，感谢您的建议。

但是，看起来下面的代码最适合我的需求。我团队的开发人员正在编写很多这些模块，我需要解决方案让他们清楚。必须致电$.proxy可能会使其不那么清晰。我希望避免在每种方法中放置var module = this，因此它会更清晰，但似乎没有它就不可能。

framework.addModule({
    id: "test-module",
    init: function () {
        var module = this;    
        $("div").click(function () {            
            module.utility1();
        });
    },

    utility1: function () {
        var module = this;
        module.utility2();
    },

    utility2: function () {        
    }
});

如果有人有更清洁的解决方案，请告诉我。

Answer 1

jQuery有一个proxy方法，它将函数绑定到特定的上下文。这会将您的事件绑定到：

$('div').click($.proxy(this, 'utility1'));

或者，您可以实例化匿名函数，而不是使用对象文字来实例化模块对象：

framework.addModule(new function () {
    this.id = 'test-module';
    this.init = function () {
        $('div').click($.proxy(this, 'utility1'));
    };
    this.utility1 = function () {
        ...more code...
    };
    this.utility2 = this.utility1;
});

访问对象文字内的父属性

1 个答案: