影响循环内闭合函数中变量的闭包

Closures affecting variables in a closed function within a loop

本文关键字：变量 闭包 函数 循环 影响      更新时间：2023-09-26
this.config = {
    source: psource,
    _events: [
        'value1',
        'value2',
        'value3'
    ]
};
// Add callbacks to source
var that = this;
for (var i = this.config._events.length - 1; i >= 0; i--) {
    var name = this.config._events[i];
    console.log(name); // correct
    $(this.config.source).on(name, function() {
        console.log(name); // value1
        console.log(that.config._events[i]); // undefined
    });
}

我看不出这里有什么问题。我删除了所有复杂的版本并放入了最简单的版本，它根本不想工作。第一个console.log正确输出所有正确的名称，但它的行为就像循环同时发生一样，然后再次为内部console.log执行。

谁能看出出了什么问题？

在该块中

console.log(that.config._events[i]); // undefined

每次调用闭包时，i最终都会是 -1。

您必须执行此类操作才能在i周围创建闭包 

$(this.config.source).on(name, function(i) { return function() {
        console.log(name); // value1
        console.log(that.config._events[i]); // undefined
    };
}(i) );

在 Javascript 中，不建议在 for 循环中定义函数。

相反，您应该使用提供each的javascript库，例如 underscore .然后你的代码将如下所示：

    _.each(this.config._events, function(e) {
       $(this.config.source).on(name, function() {
          console.log(e);
       });

您可能希望之前反转阵列。

这是 _.each 的文档

你也可以使用jQuery的$.each，它提供了一个类似的接口。

相关文章：