For循环问题中的JavaScript setTimeout

Question

我的问题是我正在尝试将超时时间增加迭代值，并将其增加1000。例如，如果增加值为5，则超时将为5 * 1000。

我曾尝试过多种方法->

var textValue = 10;
function doSetTimeout(i) {
   setTimeout(function() { console.log(i); }, i * 1000);
}

for(var i = 1; i <= textValue; i++){
     doSetTimeout(i); 
 }     

我也尝试过->

var textValue = 10;
 for(var i = 1; i <= textValue; i++){
     (function () {
         var j = i;         
         setTimeout(function timer() {
               console.log(j);
              },j*1000);
      })();     
 }

我两者都得到的是，即使每次都正确设置了变量，超时总是设置为1000 ms。

任何帮助，将不胜感激。

Answer 1

超时实际上是正确的持续时间，因为setTimeout不会停止for循环的执行，所以它们都是同时开始的。

这应该是您想要的：

 var textValue = 10; delayLoop(textValue); function delayLoop(to, at) { var at = at || 1; if (at <= to) { setTimeout(function() { console.log(at); delayLoop(to, at + 1); }, 1000 * at); } } 

Answer 2

您创建了一堆setTimeout ，它们将在1000ms，2000ms，3000ms等之后触发。问题是您同时创建了所有setTimeout ，因此每个超时将在下一个超时后1秒出现。 有两种方法可以解决问题。

1. 最初为每个setTimeout计算正确的延迟。

第一个应该是1000ms。 第二个应该在1000ms + 2000ms之后。 第三个应该在1000 + 2000 + 3000之后。依此类推。

var timeoutSum = 0;
for (var i = 1000; i <= 10000; i += 1000) {
    timeoutSum += i;

    setTimeout(function() { console.log("hi!"); }, timeoutSum);
}

2. 在完成当前超时之前，请勿触发下一个超时。

我们创建一个添加新超时的函数，然后从超时结束时调用的函数中调用它。 您可以将其视为怪异的for循环，初始值在外部，条件在中间。

var wait = 1000;

function addTimeout(wait) {
    setTimeout(function() {
        console.log('hi'); 

        if (wait < 10000) {
            addTimeout(wait + 1000);
        }
    }, wait);
}

addTimeout(wait);