javascript - 带有在运行时更改的参数的超时函数

我正在尝试以下操作:

var timeout = 300;
var colors = ['aqua', 'limegreen']
for (var i=0; i < 4; ++i) {
    console.log(colors[i % colors.length]);
    setTimeout(function() { changeColor(colors[i % colors.length]) }, i * timeout);
}

function changeColor(color) {
    console.log(color);
}

这不起作用，因为 changeColor 的参数在执行时已解析……这意味着颜色将始终相同。在我的 chrome 中，它也无法在超时后传递参数:

var color = colors[i % colors.length];
setTimeout(function() { changeColor() }, i * timeout, color);

好吧，我现在有一个有效的时间间隔的解决方法......但是因为我在这里学习......这是如何通过超时完成的？

最佳答案

调用 changeColor 的匿名函数将在 for 循环结束时执行。所以它将等于它获得的最后一个值。通过使用匿名函数包装对 setTimeout 的调用来防止这种捕获您在闭包中需要的值:

for (var i=0; i < 4; ++i) {
    console.log(colors[i % colors.length]);
    (function(i){
        setTimeout(function() { changeColor(colors[i % colors.length]) }, i * timeout);
    })(i);
}

关于javascript - 带有在运行时更改的参数的超时函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7350561/