一个 event loop只要存在,就会不断执行下边的步骤
- 在 tasks 队列中选择最老的一个task,用户代理可以选择任何 tas k队列,如果没有可选的任务,则跳到下边的 microtasks 步骤。
- 将上边选择的 task 设置为正在运行的task。
- Run: 运行被选择的 task。
- 将 event loop 的 currently running task 变为 null。
- 从 task 队列里移除前边运行的task。
- Microtasks: 执行 microtasks 任务检查点。(也就是执行 microtasks 队列里的任务)
- 更新渲染(Update the rendering)…
- 如果这是一个 worker event loop,但是没有任务在 task 队列中,并且 WorkerGlobalScope 对象的 closing 标识为 true,则销毁event loop,中止这些步骤,然后进行定义在 Web workers 章节的 run a worker。
- 返回到第一步。
概括 Event Loop 机制
- event loop 会不断循环的去取 tasks 队列的中最老的一个任务推入栈中执行,并在当次循环里依次执行并清空 microtask 队列里的任务。
- 执行完 microtask 队列里的任务,有可能会渲染更新。(浏览器很聪明,在一帧以内的多次 dom 变动浏览器不会立即响应,而是会积攒变动以最高60HZ的频率更新视图)
比喻 Event Loop 机制
主线程类似一个加工厂,它只有一条流水线,待执行的任务就是流水线上的原料,只有前一个加工完,后一个才能进行。event loops 就是把原料放上流水线的工人。只要已经放在流水线上的,它们会被依次处理,称为同步任务。一些待处理的原料,工人会按照它们的种类排序,在适当的时机放上流水线,这些称为异步任务。