Javascript setTimeout 与 for 循环中的函数

Question

使用 Javascript，我尝试循环遍历数组并在每个循环上执行一个带有时间延迟的函数。这不起作用：

<script type="text/javascript">
movesArray = new Array("s","s","s","s","s","s","s","s","s","s","s","s","s","s");
var pause = 100;
for (i=0; i<=14; i++)
{
    var t=setTimeout("ProcessKeypress(movesArray[i])", pause);
    pause = pause+100;
}
</script>

但是，如果我只是重复多次，它确实有效：

<script type="text/javascript">

var t=setTimeout("ProcessKeypress('s')", 100);
var t=setTimeout("ProcessKeypress('s')", 200);
var t=setTimeout("ProcessKeypress('s')", 300);
var t=setTimeout("ProcessKeypress('s')", 400);
var t=setTimeout("ProcessKeypress('s')", 500);

</script>

问题是，在某些情况下，我需要重复该功能几百次（可能更多），从而创建一个大网页。有没有办法循环遍历数组并延迟运行该函数？

Answer 1

您正在传递字符串“movesArray[i]”。只需转义字符串即可

movesArray = new Array("s","s","s","s","s","s","s","s","s","s","s","s","s","s");
var pause = 100;
for (i=0; i<=14; i++)
{
    var t=setTimeout("ProcessKeypress(movesArray[" +i +"])", pause);
    pause = pause+100;
}

Answer 2

使用setInterval()。您可以以任意时间间隔运行函数：

setInterval(function(){
    // do stuff
}, 300);

此外，请在 setTiemout 中使用 function(){} 而不仅仅是代码：

setTimeout(function(){
    // do stuff
}, pause);

Answer 3

如果您希望循环的每次迭代在前一次迭代完成后都有一定的时间延迟，那么您的执行方式将会在数组索引方面出现问题。这些是我看到的问题：

1. 您的索引将不正确，因为对 ProcessKeypress() 的所有调用都会有 i == 15。
2. 最好传递 setTimeout()实际的 javascript 函数而不是它必须计算的字符串。
3. 而且，我还认为，通常最好在第一个计时器完成时设置下一个计时器，而不是立即设置所有计时器（尽管两者都可以工作）。
4. 而且，您的代码已达到 movesArray[14]，但数组中没有那么多项目。最好引用数组 .length 而不是硬编码 14。

我的建议可以这样实施：

<script type="text/javascript">
movesArray = new Array("s","s","s","s","s","s","s","s","s","s","s","s","s","s");
var i = 0;

function nextIteration() {
    ProcessKeypress(movesArray[i++]);
    if (i < movesArray.length) {
        setTimeout(nextIteration, 100);
    }
}

nextIteration();

</script>