您可能不了解的 Interval

作者:chilleen 来源:ITPOW(原创) 日期:2006-12-10

Interval 英文解释为 间隔、空隙,在 JS 中有两个关于 Interval 的函数:setInterval 和 clearInterval。

我们都知道 setInterval 是设置定时执行,而 clearInterval 是清除定时执行,但这其中也可能有您还不了解的地方。

一、setInterval 记时开始的一瞬间,要不要触发执行?

setInterval("alert('您好!');", 2000);

上述代码是每 2 秒钟弹出一个显示着“您好!”的对话框,我们知道在 2、4、6...秒钟,都会弹出对话框,那么在 0 秒,是否弹出呢?结论是不弹出,也即在记时开始的一瞬间,不触发执行。

二、单线程影响 clearInterval。

var interval = setInterval("alert('您好!');", 2000);
setTimeout("clearInterval(interval);", 3000);

上述代码在第 2 秒钟的时候弹出对话框,在第 3 秒钟的时候 clearInterval 被触发,停止执行弹出对话框。

但是,如果我们不是弹出对话框,而是更复杂的程序,时间间隔也不是 2000 毫秒和 3000 毫秒,而是 20 毫秒和 30 毫秒,情况就不一样了。由于 JS 是单线程执行的,虽然到了触发 clearInterval 的时间了,可是 setInterval 还是没有停下来,还是要把即将到来的触发进行了,它才会停下来。打个比方,如果这种现象发生在了上述两行代码中,那么会弹出两次对话框。

解决办法是增加一个变量,表明触发的代码可否执行。setTimeout("clearInterval(interval);canProcessing=false;", 3000); 如代码中所示,在清除定时器的同时增加了一个变量 canProcessing=false 用以表示不能执行了。而 setInterval 触发的函数中,增加一行代码:if (!canProcessing) return,此时程序便会直接返回,而不会执行后面的内容。

您还可以参阅:setInterval 和 clearInterval

相关文章