3

我最近问了一个关于在 for 循环中延迟的 jquery 行为的问题。链接在这里

我收到了一个有效的答案,但我不明白它为什么有效。

如果我有以下代码:

function update(callbacks) {
    return $.Deferred(function(dfr) {
        setTimeout(function() {
            callbacks.success()
        }, 1000);
        dfr.resolve();
    }).promise();
}

function updateElements(deferreds) {
    for (var i = 0; i < 5; i++) {
        (function() {
            var index = i;
            deferreds.push(update({
                success: function() {
                    alert(index);
                }
            }));
        })();
    }
};

(function() {
    var deffereds = [];
    updateElements(deffereds);
    $.when.apply($, deffereds).then(function() {}, function() {});
})();​

它返回 5 个警报窗口,其值从 0 到 4。如果我将 updateElements 方法更改为:

function updateElements(deferreds) {
    for (var i = 0; i < 5; i++) {
        var index = i;
        deferreds.push(update({
            success: function() {
                alert(index);
            }
        }));
    }
};

它返回 5 个警报窗口,其值仅为 4。有人可以解释这种行为吗?我正在努力理解差异来自哪里。

谢谢!

4

1 回答 1

3

它这样做的原因是因为你已经关闭了一个循环

(function() {
        var index = i;
        deferreds.push(update({
            success: function() {
                alert(index);
            }
        }));
})();

这个自执行块变成了一个静态值,因为它没有传入外部值。正如您链接的答案,您需要传入该值。请注意在 IEFE 末尾给出的值的关键区别(立即执行函数表达式)。对不起上限,但这需要强调。

(function(VALUE_ACCEPTED){
  //VALUE_ACCEPTED accepts the passed value of VALUE_PASSED
})(VALUE_PASSED)

这样你的代码就变成了这样:

function updateElements(deferreds) {
for (var i = 0; i < 5; i++) {
    (function(valueAccepted) { // valueAccepted = the passed in value from i
        var index = valueAccepted;
        deferreds.push(update({
            success: function() {
                alert(index);
            }
        }));
    })(i); // pass in i to valueAccepted
 }
};
于 2012-11-15T09:00:25.040 回答