[绍棠] js中的宏任务与微任务

绍棠

于 2022-03-09 13:14:36 发布

阅读量161

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/happyshaotang2/article/details/123375068

本文详细介绍了JavaScript中的事件循环机制，包括宏任务、微任务及其包含的内容。JavaScript采用单线程和Event Loop来处理同步和异步任务，确保主线程不被阻塞。宏任务在每次循环时执行，而微任务在当前宏任务执行完毕后立即执行，确保更快的响应速度。在宏任务执行前后，还会进行页面渲染。整个过程遵循特定的执行顺序和任务调度策略。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

事件循环

JavaScript 语言的一大特点就是单线程，也就是说，同一个时间只能做一件事。为了协调事件、用户交互、脚本、UI 渲染和网络处理等行为，防止主线程的不阻塞，Event Loop 的方案应用而生。Event Loop 包含两类：一类是基于 Browsing Context，一种是基于 Worker。二者的运行是独立的，也就是说，每一个 JavaScript 运行的"线程环境"都有一个独立的 Event Loop，每一个 Web Worker 也有一个独立的 Event Loop。

本文所涉及到的事件循环是基于 Browsing Context。

任务队列

根据规范，事件循环是通过任务队列的机制来进行协调的。一个 Event Loop 中，可以有一个或者多个任务队列(task queue)，一个任务队列便是一系列有序任务(task)的集合；每个任务都有一个任务源(task source)，源自同一个任务源的 task 必须放到同一个任务队列，从不同源来的则被添加到不同队列。setTimeout/Promise 等API便是任务源，而进入任务队列的是他们指定的具体执行任务。

在事件循环中，每进行一次循环操作称为 tick，每一次 tick 的任务处理模型是比较复杂的，但关键步骤如下：