1.案例
const useTime = t => {
let start = Date.now()
while(Date.now() - start < t) {}
}
let timer1 = setTimeout(() => {
console.log(3)
}, 500)
let timer2 = setTimeout(() => {
console.log(4)
}, 1000)
console.log(1)
useTime(2000)
console.log(2)
2.初步猜测结果
- 打印猜测1，3，4，2 从上到下代码输出
3.测试验证，发现和预想不一致，为什么？
测试结果
1
2
<·underfined
3
4
4.原理讲解
- 进入全局执行上下文
<创建由第三方计时模块管理的timer1，timer1会在500ms后把任务fn1放入任务队列>
<创建由第三方计时模块管理的timer2，time2会在1000ms后把任务fn2放入任务队列>
<输出1> - 进入useTime执行上下文
< 执行代码耗时2000ms，退出useTime执行上下文>
在500ms和1000ms时timer1和timer2各自完成投放，此操作不属于JS主线 - 返回全局执行上下文
<输出2>
同步任务执行完毕
开始扫描任务队列
取出队列的fn1 - 进入fn1执行上下文
<输出3，退出fn1执行上下文>
取出队列的fn2 - 进入fn2执行上下文
<输出4，退出fn2执行上下文>
循环扫描任务队列
5.范例
setTimeout(()=>{
console.log(1)
}, 0)
console.log(2)
let t = true
setTimeout(() => {
t = false
}, 1000)
while(t){ }
console.log('end')
