Question

我正在阅读关于jQuery.proxy()的api。它看起来很有希望，但我想知道在什么情况下这是最好用的。谁能开导我？

Answer 1

如果需要将this值绑定到特定对象的函数。例如，在回调中，例如事件处理程序，AJAX回调，超时，间隔，自定义对象等。

这只是一个可能有用的情况的制造示例。假设有一个Person对象具有属性名称。它还链接到文本输入元素，每当输入值更改时，此person对象中的名称也会更新。

function Person(el) {
    this.name = '';

    $(el).change(function(event) {
        // Want to update this.name of the Person object,
        // but can't because this here refers to the element
        // that triggered the change event.
    });
}

我们经常使用的一个解决方案是将此上下文存储在变量中，并在回调函数中使用它，例如：

function Person(el) {
    this.name = '';

    var self = this; // store reference to this

    $(el).change(function(event) {
        self.name = this.value; // captures self in a closure
    });
}

或者，我们可以在这里使用jQuery.proxy，因此对this的引用引用Person的对象而不是触发事件的元素。

function Person(el) {
    this.name = '';

    $(el).change(jQuery.proxy(function(event) {
        this.name = event.target.value;
    }, this));
}

请注意，此功能已标准化为ECMAScript 5，现在包含从bind借用的prototypejs方法，并且已在某些浏览器上提供。

function Person(el) {
    this.name = '';

    $(el).change(function(event) {
        this.name = event.target.value;
    }.bind(this)); // we're binding the function to the object of person
}

Answer 2

这只是设置闭包上下文的简写方法，例如：

$(".myClass").click(function() {
  setTimeout(function() {
    alert(this); //window
  }, 1000);
});

但是，我们通常希望this与我们使用的方法保持一致，$.proxy()用于此方法，如下所示：

$("button").click(function() {
  setTimeout($.proxy(function() {
    alert(this); //button
  }, this), 1000);
});

它通常用于延迟调用，或任何你不想做一个声明闭包的简写方法的地方。将上下文指向对象的字符串方法......好吧我还没有在日常代码中遇到过实际用法，但我确信有应用程序，只取决于你的对象/事件结构。

Answer 3

例如，如果要创建回调。而不是：

var that = this;

$('button').click(function() {
    that.someMethod();
});

你可以这样做：

$('button').click($.proxy(this.someMethod, this));

或者，如果您创建一个接受回调的插件，则必须为回调设置特定的上下文。

jQuery.proxy（）用法

3 个答案: