|

Aimee

Write the Code. Change the World.

setInterval和setTimeout

· 分享镜#h5

setInterval()方法也会返回一个循环定时 ID,可以用于在未来某个时间点上取消循环定时。要 取消循环定时,可以调用 clearInterval()并传入定时 ID。相对于 setTimeout()而言,取消定时的 能力对 setInterval()更加重要。毕竟,如果一直不管它,那么定时任务会一直执行到页面卸载。下 面是一个常见的例子:

let num = 0, intervalId = null;
let max = 10;
let incrementNumber = function() {
      num++;
// 如果达到最大值,则取消所有未执行的任务 
  if (num == max) {
    clearInterval(intervalId);
    alert("Done");
  }
}
intervalId = setInterval(incrementNumber, 500);

在这个例子中,变量 num 会每半秒递增一次,直至达到最大限制值。此时循环定时会被取消。这个 模式也可以使用 setTimeout()来实现,比如:

let num = 0;
let max = 10;
let incrementNumber = function () {
  num++;
  // 如果还没有达到最大值,再设置一个超时任务 
  if (num < max) {
    setTimeout(incrementNumber, 500);
  } else {
    alert("Done");
  }
}
setTimeout(incrementNumber, 500);

注意在使用 setTimeout()时,不一定要记录超时 ID,因为它会在条件满足时自动停止,否则会 自动设置另一个超时任务。这个模式是设置循环任务的推荐做法。setIntervale()在实践中很少会在 生产环境下使用,因为一个任务结束和下一个任务开始之间的时间间隔是无法保证的,有些循环定时任务可能会因此而被跳过。而像前面这个例子中一样使用 setTimeout()则能确保不会出现这种情况。一 般来说,最好不要使用 setInterval()。

评论0

登录后参与评论。

还没有评论,来抢沙发吧。

回到顶部