javascript基础从小白到高手系列一千六百八十七：setInterval()

次，直到取消循环定时或者页面卸载。setInterval()同样可以接收两个参数:要执行的代码(字符 串或函数)，以及把下一次执行定时代码的任务添加到队列要等待的时间(毫秒)。下面是一个例子:

注意 这里的关键点是，第二个参数，也就是间隔时间，指的是向队列添加新任务之前等 待的时间。比如，调用 setInterval()的时间为 01:00:00，间隔时间为 3000 毫秒。这意 味着 01:00:03 时，浏览器会把任务添加到执行队列。浏览器不关心这个任务什么时候执行 或者执行要花多长时间。因此，到了 01:00:06，它会再向队列中添加一个任务。由此可看 出，执行时间短、非阻塞的回调函数比较适合 setInterval()。
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"); }8
}
intervalId = setInterval(incrementNumber, 500);

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

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

注意在使用 setTimeout()时，不一定要记录超时 ID，因为它会在条件满足时自动停止，否则会 自动设置另一个超时任务。这个模式是设置循环任务的推荐做法。setIntervale()在实践中很少会在 生产环境下使用，因为一个任务结束和下一个任务开始之间的时间间隔是无法保证的，有些循环定时任