时间戳

首页 > 解决方案 > setInterval 打印多次

javascript - setInterval 打印多次

问题描述

我写了一段代码，其中涉及 a 中的一条if..else语句，我的目标是在每次迭代 1 秒后for-loop执行该部分的内容。else例如，我正在打印 10 到 1。首先，10 将在 1 秒后打印 9，然后再打印 1 秒 8，依此类推，直到它为 0。所以我的方法是

这pgn很重要。

(function () {
var i, pgn = 0;
for (i = 1; pgn < 10; i++) {
    if (i === 1) {
        console.log(10);
        pgn++;
    }

    else {
        (function countdown() {
            var count1 = 9;
            var myTimer = setInterval(function () {
                console.log(count1);
                count1 -= 1;
                if (count1 <= 0) {
                    clearInterval(myTimer);
                }
            }, 1000);
         })()
        pgn += 1;
      }
}
})()

它给了我这样的结果，

10
9
9
9
9
and then after several 9s, 8 8 8.. and so on until 0.

然后出于好奇，我替换pgn += 1;为pgn+=10，代码完全按照我的意愿工作。它打印 10，然后在第二个 9 之后打印，依此类推。有人可以解释它是如何发生的吗？

标签： javascript

解决方案

setInterval将在给定的毫秒数过去后重复调用函数。当您通过1创建多个计时器而不是单个计时器来增加循环时，因此一旦所有计时器到期，它们就会在控制台中记录值，但是当您逐步增加时10，您的循环将只运行一次并且将只有一个计时器。

所有你需要的是：

var count1 = 10;
var myTimer =  setInterval(function () {
  console.log(count1);
  count1 -= 1;
  if (count1 <= 0) {
    clearInterval(myTimer);
  }
}, 1000);

推荐阅读