JS:尝试将setTimeout与增量值一起使用

时间:2014-07-05 23:32:12

标签: javascript delay settimeout intervals

我试图在函数调用中使用增量ID在循环上设置一些延迟,以及逐渐增加的延迟时间。我设置的是这样的:

var delay = 0;
var delayMilliseconds = 250;
timeOutArray = [];

for(var i=0; i<100; i++){
    delay = i*delayMilliseconds;

    timeOutArray[i] = setTimeout(function(){
            loadRoute(modelsArray[i], (i+1));
        },delay);
}

我遇到的问题是,当调用任何loadRoute()函数时,被引用的“i”已经增加到99.

我正在寻找一种方法让它在我设置超时时识别“i”的数量,而不是超时发生的时刻。

我发现这篇关于使用“承诺”的文章,但有点令人困惑。 Javascript - Wait the true ending of a function that uses setTimeout

有人可以告诉我知道如何在这些调用中实现promise,或者在没有将setTimeout代码全部包含在eval()中的情况下执行任何操作吗?

4 个答案:

答案 0 :(得分:0)

将其保存在闭包中以保留原始值。

timeOutArray[i] = setTimeout( (function(i) { return function(){
    loadRoute(modelsArray[i], (i+1));
}) (i),delay);

基本上,您在每次循环迭代中创建并执行新的匿名函数,并将当前i的副本传递给它。执行时,此函数返回另一个匿名函数,然后传递给setTimeout。但是,此函数保留对其创建范围的引用,从而看到外部匿名函数保存的i

这有点棘手。您可以使用JavaScript在Google上关闭。

答案 1 :(得分:0)

或者,或者在for循环之外定义你的超时函数并调用:

var delay = 0;
var delayMilliseconds = 250;

function doTimeoutStuff(i, delay) {
    setTimeout(function () {
        loadRoute(modelsArray[i], (i+1));
    }, delay);
}

for (var i=0; i<5; i++) {
    delay = i*delayMilliseconds;
    doTimeoutStuff(i, delay);
}

答案 2 :(得分:0)

这是代码的工作示例。问题是误解范围&amp;闭合

var delay = 0;
var delayMilliseconds = 250;
timeOutArray = [];

for (var i=1; i<100; i++) {
    (function(j){
        delay = j*delayMilliseconds;
        timeOutArray[j] = setTimeout(function(){
            console.log(j)
            //loadRoute(modelsArray[j], (j+1));
        },delay);
    })( i );
}

<强>解释

(function(j){
 //this part of the code create new scope
})( i );

在每次迭代中使用以上功能为每个迭代创建新范围,这使我们的超时函数回调关闭每个迭代的新范围的机会,其中一个变量具有正确的每次迭代值,供我们访问。

Source - For more info

答案 3 :(得分:0)

setTimeout()除了创建闭包外,还允许您在执行时将变量传递给回调函数,该变量将在回调期间存在于回调函数中。

setTimeout(function[, delay, arg1, arg2, ...]);

来源:MDN - setTimeout