|
setTimeout 是浏览器提供的一个方法，可以用它来设置一个定时器，定时器到期之后会执行放在里面的函数。了解一个方法，最直接的方式就是看源码，这里从浏览器是怎样来实现 setTimeout 的角度来了解。
浏览器怎样实现 setTimeout
浏览器是根据消息队列和事件循环两大机制来控制各个线程之间的协调工作的。 主线程不断从事件循环中取出任务，执行任务，其他线程触发的任务按消息队列的数据结构来排进事件循环中。
setTimeout，说白了就是要让JS引擎执行一段异步代码的任务，并且还要限定其时间。很显然消息队列的数据结构无法满足限定时间这个需求，所以需要再开一个队列。Chrome除了维护一个消息队列之外，还维护了一个延迟队列，这个队列主要用来维护一些需要延迟执行的任务，所以当JS调用setTimeout的时候，里面的回调函数会被放在该队列中。消息队列和延迟队列是处于同级关系，但消息队列在前，即每次当主线程从消息队列之中取出一个任务执行完成后，便会考虑从延迟队列中取出一个任务，如果满足条件则取出，不满足则跳过。
setTimeout的注意事项
- 如果当前任务执行时间过久，会耽误到延迟队列中的任务的执行时间
比如说，在当前代码中，有一个for循环从1加到100000000，而在for循环前面又开启了一个定时器，是立刻执行，但是执行完之后可以发现，定时器中的回调函数过了很久才会执行 - 如果 setTimeout 存在嵌套，浏览器会自动设置最短时间间隔为4ms
- 未激活的页面，setTimeout执行最小间隔时间是 1000 ms
这么做的目的是为了优化后台页面的加载损耗以及降低耗电量 - 延迟执行时间有最大值
因为浏览器是以 32 bit 存储延时值，所以最大数字为 2的32次方-1，即最大延迟时间为这么多毫秒 - 使用 setTimeout 设置的回调函数中的 this 不符合直觉
所以最好用箭头函数来设置setTimeout的回调函数
|