Javascript增量循环（倒序）答案

【问题标题】：Javascript increment Loop (interverted order)Javascript增量循环（倒序）
【发布时间】：2021-01-05 15:08:28
【问题描述】：

我有一个问题，我不明白为什么我的“console.log”来自“startAnimation”函数

很好地展示了我： 20 19 18 ...

在“animationAnimation”函数中它返回我我 = 1 我 = 2 ....

animationAnimation(i, self) {
    setTimeout(function() {
        console.log("i =" + i);
    }, 2000 * i);
    return self;
}

startAnimation(self) {
    for (let i = 20; i > 0; i--) {
        console.log(i);
        self.animationAnimation(i, self);
    }
}

【问题讨论】：

您的 for 循环从 20 开始，减去 1 直到达到 1，此控制台会立即记录。然后它等待这 i * 2000 次再次打印
由于定时器的原因，它仍然在 2 秒调度 1，在 4 秒调度 2，依此类推。

标签： javascript for-loop increment

【解决方案1】：

您正在使用setTimeout，延迟是索引的 2000 倍，因此较小的索引将具有较少的延迟，因此会先执行。

如果您想保持相反的执行顺序，您可以使用2000 * (max - i) 计算延迟，在本例中为2000 * (20 - i)。

【讨论】：

【解决方案2】：

让我们一步一步来您正在经历一个 for 循环，它将 20 19 18 ....1 输出到控制台。

  startAnimation(self) {
    for (let i = 20; i > 0; i--) {
      console.log(i);
      self.animationAnimation(i,self);

在那个 for 循环中，首先使用 i==20，调用 animationAnimation。

    animationAnimation(i, self) {
    setTimeout(function () {
      console.log("i =" + i);
    }, 2000 * i);
    return self;
  }

这会设置一个计时器，显示“40 秒后，将 i =20 输出到控制台”

然后你从 for 循环中调用它，使用 i==19 表示“38 秒后，将 i =19 输出到控制台”

依此类推，直到 i==1 表示“2 秒后输出 i =1 到控制台。

因此，虽然 for 循环从 20 降到 1 并立即发生，但您设置了 20 个在不同时间执行操作的计时器，并且 i =1 将首先到达控制台。

【讨论】：