在这种情况下JavaScript闭包是如何工作的？

JavaScript闭包在这种情况下是如何工作的，更具体地说：最后的

（i）

做了什么

for(var i = 0; i < 10; i++) {
    (function(e) {
        setTimeout(function() {
            console.log(e);  
        }, 1000);
    })(i);
}

for（变量i=0；i<10；i++）{
（职能（e）{
setTimeout（函数（）{
控制台日志（e）；
}, 1000);
})（i） )；
}

我还试图在我的代码中实现它，但似乎我没有正确地理解它

for (var i=0; i < len; i++) {

    var formID = document.forms["form-" + i];
    $(formID).bind("submit", validate);

    $(formID).bind("change", function(i){
        var divI = '#ind-' + i;
        $(divI).css("background-color","green");
    })(i);
}

for（变量i=0；i

这是一种用于围绕变量创建局部范围的模式。如果未使用此选项，则在for循环完成后，对

console.log（i）

的每次调用都会记录

i

（10）的值

for(var i = 0; i < 10; i++) {
    // create new function
    (function(e) {
        // log each counter after 1 second.
        setTimeout(function() {
            console.log(e);  
        }, 1000);
    // execute it with the counter
    })(i); 
}

与

( // contain the window.alert function
    window.alert
) // it now points to a function
("alertMessage"); // call it as a function

---

虽然不是对结案问题的直接回答，但以下是我对这个问题的看法

我会重新编写逻辑，以避免闭包的需要（因为对于需求来说似乎过于复杂）

表单的命名有一种模式，这一事实使事情变得非常简单

$('form[id^="form-"]').submit(validate)
     .change(function(){
          var divI = '#ind-' + this.id.replace('form-','');
          $(divI).css("background-color","green");
     });

---

demo

thanx@Raynos，我看到了，但我不清楚它是如何工作的，以及如何在我的代码中实现它（我编辑了这个问题），有什么建议吗？：）+1表示“这里真正的问题是在循环中创建函数。不要这样做。”（假设您谈论的是立即调用的函数）。也许可以添加一个命名函数的示例？就我个人而言，我不太确定我是否喜欢这样的内联lambda。我想这是一个风格的问题，当然也受其他函数式语言经验的影响。我看到了争论的两个方面，但我不确定哪一个赢了：-）@Pointy@T.J.Crowder我认为第二个例子更好，而不是将数据绑定到闭包，将数据绑定到DOM元素，这是一个更“便宜”的存在位置@T.J.Crowder也很抱歉破坏了你的answer@Raynos：我同意。哈哈，不用担心，答案很好。如果你想了解更多关于闭包的信息，这里有一些链接可能会有所帮助：这个视频真的很棒，thanxthanx，但我不明白

form[id^=“form-”]

它做什么？@IlyaD，它是最棒的。它意味着查找所有

表单

，这些表单的

id

以

表单-“

开头。

function makeGreen(form, i) {
    $(form).change(function() {
         $("#ind-"+i).css("background-color", "green");
    });
}

for (var i=0; i < len; i++) {
    var formID = document.forms["form-" + i];
    $(formID).bind("submit", validate);
    // call a helper function which binds the change handler to the correct i
    makeGreen(formID, i);
}

function makeGreen() {
     var divId = $(this).data("div-id");
     $(divId).css("background-color", "green");
}

for (var i=0; i < len; i++) {
    $(document.forms["form-" + i])
        .bind("submit", validate)
        // store i on the form element
        .data("div-id", "#ind-" + i)
        // use a single event handler that gets the divId out of the form.
        .change(makeGreen);
}

( // contain the function we create.
    function(parameterA) {
         window.alert(parameterA);
    }
) // this now points to a function
("alertMessage"); // call it as a function.

( // contain the window.alert function
    window.alert
) // it now points to a function
("alertMessage"); // call it as a function

$('form[id^="form-"]').submit(validate)
     .change(function(){
          var divI = '#ind-' + this.id.replace('form-','');
          $(divI).css("background-color","green");
     });