EventLoop

最新推荐文章于 2024-11-28 14:32:05 发布

鲨鱼辣椒面丶

最新推荐文章于 2024-11-28 14:32:05 发布

阅读量159

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript

本文链接：https://blog.csdn.net/qq_42994986/article/details/119521096

javascript 专栏收录该内容

16 篇文章

订阅专栏

console.log('start');
setTimeout(() => {  
	console.log('timeout');
});
Promise.resolve().then(() => {  
	console.log('resolve');
});
console.log('end');

分析一下:
1）刚开始整个脚本作为一个宏任务来执行，因此先打印start和end
2）setTimeout 作为一个宏任务放入宏任务队列
3）Promise.then作为一个为微任务放入到微任务队列
4）当本次宏任务执行完，检查微任务队列，发现一个Promise.then, 执行
5）接下来进入到下一个宏任务——setTimeout, 执行
因此最后的顺序是:

start
end
resolve
timeout

总结:
1）一开始整段脚本作为第一个宏任务执行
2）执行过程中同步代码直接执行，宏任务进入宏任务队列，微任务进入微任务队列
3）当前宏任务执行完出队，检查微任务队列，如果有则依次执行，直到微任务队列为空
4）执行浏览器 UI 线程的渲染工作
5）检查是否有Web worker任务，有则执行
6）执行队首新的宏任务，回到2，依此循环，直到宏任务和微任务队列都为空