设置超时.停止计时器

SetTimeout. Stop timer

本文关键字：计时器 超时 设置      更新时间：2023-09-26

就像在这个例子中停止setTimout一样？

var i = 1;
var timerId = setTimeout(function tick() {
  if (i == 5) clearTimeout(timerId);
  i++;
  console.log("Tick");
  timerId = setTimeout(tick, 2000);
}, 2000);

我知道您可以更改此代码，然后一切都会起作用，但我想了解为什么第一个示例不起作用。

var i = 1;
var timerId = setTimeout(function tick() {
  console.log('Tick');
  
  if (i < 5) setTimeout(tick, 2000);
  
  i++;
}, 2000);

第一个代码片段继续循环，因为：

  1. 您正在更改 timerId 与设置的每个新超时。
  2. 您正在清除已完成执行的超时（因为它已调用该函数），然后创建一个新超时。

您应该使用 setInterval() 而不是 setTimeout() ，因为间隔将以指定的频率无限期地重复，而超时只会在指定时间过后执行一次。

第一个示例不起作用，因为您始终设置超时，无论 i 的值如何。 如果 i 等于 5，则添加返回语句

var i = 1;
var timerId = setTimeout(function tick() {
  if (i == 5) {
      return;
  }
  i++;
  console.log("Tick");
  timerId = setTimeout(tick, 2000);
}, 2000);

计时器过期后清除超时是可以的，但这不是必需的。

正因为如此，你的第二个代码片段优于第一个。

在你的第一个代码片段中，你总是设置超时，即使你的IF条件得到满足，并且你应该返回，

我将重写如下所示的函数

var i = 1;
function tick() {
  if (i == 5) {
      return;
  }
  i++;
  console.log("Tick");
  setTimeout(tick, 2000);
}
setTimeout(tick, 2000);

或使用间隔为

var i = 1;
function tick() {
  if (i == 5) {
      clearInterval(timerId);
      return;
  }
  i++;
  console.log("Tick");
}
var timerId = setInterval(tick, 2000);
相关文章：