1.背景介绍

setTimeout()

指定延迟时间之后来执行代码

只执行一次，不会循环。

setInterval()

每隔指定的时间执行代码

重复执行，无限循环

2.知识剖析

setInterval

语法：window.setInterval("javascript function",milliseconds);

window.setInterval() 方法可以不使用window前缀，直接使用函数setInterval()。

setInterval() 第一个参数是函数（function），第二个参数间隔的毫秒数。

调用函数格式(假设有一个clock()函数):

setInterval("clock()",1000)
或
setInterval(clock,1000)

setTimeout

语法：window.setTimeout("javascript function", milliseconds);

setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。这个语句可能诸如 "alert('5 seconds!')"，或者对函数的调用，诸如 alertMsg。

第二个参数指示从当前起多少毫秒后执行第一个参数。

调用函数格式同上。

3.常见问题

任务一九宫格颜色变化，为什么会越点越快？

setInterval() 的运行模式是按照指定的周期（以毫秒计）来调用函数或计算表达式。

这就使得在某个多次执行或者重复执行事件中创建的setInterval()都会独立的保留下来

4.解决方案

我们需要清除定时器

window.clearTimeout(int);

window.clearInterval(int)

这两种定时器，设置方法有区别，但是清除方法是等效的，就是无论你设置的定时器是哪一种 都可以使用上边任意一种清除代码清除掉

5.编码实战

6.扩展思考

当setInterval()的延迟时间设置为0会怎样？

HTML5规范规定最小延迟时间不能小于4ms，即x如果小于4，会被当做4来处理。 不过不同浏览器的实现不一样。

比如，Chrome可以设置1ms，IE11/Edge是4ms。

7.参考文献

8.更多讨论