javascript回調函數的參數

Question

var data = [{offset: 2000, str:'foo'}, {offset: 4000, str:'bar'}];

for (var i=0; i<data.length; i++) {
    var x = data[i];
    setTimeout(function(){printStuff(x.str)}, x.offset);
}

function printStuff(str) {
    console.log(str);
}

我原本希望在2000毫秒偏移量時獲得printStuff('foo')而在4000毫秒偏移量時獲得printStuff('bar') ，但它兩次都打印'bar'。 我不知道發生了什么事，請幫忙。

Answer 1

做這個 ：

for (var i = 0; i < data.length; i++) {
    (function (x) {
        setTimeout(function () {
            printStuff(x.str)
        }, x.offset);
    })(data[i]);
}

您的問題是在調用函數時x在閉包中已更改。

Answer 2

您可以使用免費提供閉包的函數迭代：

data.forEach( function( x ) {
      setTimeout( printStuff.bind(null, x.str), x.offset );
});

如果需要oldIE支持，則適用於所有墊片：

的forEach

捆綁

Answer 3

setTimeout不會阻止代碼繼續執行，因此循環完成，並且在執行setTimeout回調時，“ x”的最新值是data數組中的第二個對象。