javascript - jQuery 访问带有事件和触发器的 'this' 对象

Question

我有两个由主类编排的类，我想知道在这些类中触发事件时如何访问正确的“this”对象。这是我拥有的:

// My main class that orchestrates the two worker classes
function MainClass()
{
    this.workerOne = new ChildWorkerOne();
    this.workerOne.bindBehaviors.apply(this.workerOne);

    this.workerTwo = new ChildWorkerTwo();
    this.workerTwo.bindBehaviors.apply(this.workerTwo);

    // a custom event I'm creating and will be triggered by
    // a separate event that occurs in workerTwo
    $(document).bind("customEvent", this.onCustomAction);   
}

MainClass.prototype.onCustomAction = function(event, data)
{
    // I want to call a method that belongs to 'workerOne'. 
    this.workerOne.makeItHappen();

    // However, the 'this' object refers to the 'Document' and 
    // not the 'MainClass' object.
    // How would I invoke 'makeItHappen' here?
};

ChildWorkerOne.prototype.makeItHappen = function()
{
    // Do a bunch of work here
};

ChildWorkerTwo.prototype.bindBehaviors = function()
{
    $(div).click(function(e){
        $.post(url, params, function(data)
        {
            // do a bunch of work with this class and then
            // trigger event to update data with ChildWorkerOne
            $(document).trigger("customEvent", [data]);
        }
    });
};

我不想合并 ChildWorkerOne 和 ChildWorkerTwo，因为它们是两个不属于一起的独立实体，并且 MainClass 在概念上应该协调 ChildWorkerOne 和 ChildWorkerTwo。但是，我确实想在另一个中调用其中一个的行为。

执行此操作的最佳方法是什么？

Answer 1

您需要保留this 值，您可以通过多种方式做到这一点，jQuery 1.4+ 为您提供了$.proxy。方法，例如:

//...
$(document).bind("customEvent", $.proxy(this.onCustomAction, this));
// or
$(document).bind("customEvent", $.proxy(this, 'onCustomAction'));
//...