这里是修真院web小课堂，每篇分享文从
【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】
八个方面深度解析web知识/技能，本篇分享的是：
【定时器是什么？ 】
大家好，我是IT修真院武汉第10期学员，一枚正直、纯洁、善良的前端程序员。
今天给大家分享一下，修真院官网任务JS-task1，深度思考的知识点——什么是定时器？有什么用？
1.背景介绍
浏览器（或者说JS引擎）执行JS的机制是基于事件循环。
由于JS是单线程，所以同一时间只能执行一个任务，其他任务就得排队，后续任务必须等到前一个任务结束才能开始执行。
为了避免因为某些长时间任务造成的无意义等待，JS引入了异步的概念，用另一个线程来管理异步任务。
同步任务直接在主线程队列中顺序执行，而异步任务会进入另一个任务队列，不会阻塞主线程。等到主线程队列空了（执行完了）的时候，就会去异步队列查询是否有可执行的异步任务了（异步任务通常进入异步队列之后还要等一些条件才能执行，如ajax请求、文件读写），如果某个异步任务可以执行了便加入主线程队列，以此循环。
JS定时器
JS的定时器目前有三个：setTimeout、setInterval和setImmediate。
定时器也是一种异步任务，通常浏览器都有一个独立的定时器模块，定时器的延迟时间就由定时器模块来管理，当某个定时器到了可执行状态，就会被加入主线程队列。
JS定时器非常实用，做动画的肯定都用到过，也是最常用的异步模型之一。
有时候一些奇奇怪怪的问题，加一个setTimeout(fn, 0)（以下简写setTimeout(0)）就解决了。不过，如果对定时器本身不熟悉，也会产生一些奇奇怪怪的问题。
2.知识剖析
setTimeout
setTimeout(fn, x)表示延迟x毫秒之后执行fn。
使用的时候千万不要太相信预期，延迟的时间严格来说总是大于x毫秒的，至于大多少就要看当时JS的执行情况了。另外，多个定时器如不及时清除（clearTimeout），会存在干扰，使延迟时间更加捉摸不透。所以，不管定时器有没有执行完，及时清除已经不需要的定时器是个好习惯。HTML5规范规定最小延迟时间不能小于4ms，即x如果小于4，会被当做4来处理。 不过不同浏览器的实现不一样，比如，Chrome可以设置1ms，IE11/Edge是4ms。setTimeout注册的函数fn会交给浏览器的定时器模块来管理，延迟时间到了就将fn加入主进程执行队列，如果队列前面还有没有执行完的代码，则又需要花一点时间等待才能执行到fn，所以实际的延迟时间会比设置的长。如在fn之前正好有一个超级大循环，那延迟时间就不是一丁点了。
setInterval
setInterval的实现机制跟setTimeout类似，只不过setInterval是重复执行的。 对setInterval(fn, 100)容易产生一个误区：并不是上一次fn执行完了之后再过100ms才开始执行下一次fn。 事实上，setInterval并不管上一次fn的执行结果，而是每隔100ms就将fn放入主线程队列，而两次fn之间具体间隔多久就不一定了，跟setTimeout实际延迟时间类似，和JS执行情况有关。
3.常见问题
定时器引起的代码超级无敌托马斯回旋式爆炸阻塞
4.解决方案
清除定时器呗~
5.编码实战
还有那些方法可以实现定时器或类似定时器的效果？
Promise
Promise是很常用的一种异步模型，如果我们想让代码在下一个事件循环执行，可以选择使用setTimeout(0)、setImmediate、requestAnimationFrame(Chrome)和Promise。而且Promise的延迟比setImmediate更低，意味着Promise比setImmediate先执行。
6.扩展思考
7.参考文献
8.更多讨论
详情请看：
Q1:在我们日常工作中，有哪些地方会用到定时器？
答：动画。
Q2:除了前文提到的两种常用的定时器，你还接触过哪些定时器的使用？
答：promise。
Q3:在定时器的使用过程中可能存在哪些问题？
答：代码阻塞。
作者：狗富贵互相汪
链接：https://www.jianshu.com/p/01757a958dfb
來源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。
更多内容，可以加入IT交流群565734203与大家一起讨论交流
这里是技能树·IT修真院：https://www.jnshu.com，初学者转行到互联网的聚集地