JavaScript中的事件循环

事件循环是前端面试中常考的一个知识点之一，对于帮助我们深入理解JavaScript有很大帮助。

JavaScript是一门单线程语言，那浏览器是怎么处理异步请求的呢？

首先我们需要了解 线程和进程：

• 进程：CPU资源分配的最小单位，一个进程可包含多个线程
• 线程：CPU调度的最小单位

浏览器是多进程的，每一个tab标签都代表一个独立的进程；
其中的浏览器渲染进程是多线程的，主要包含了以下线程：

• GUI 渲染线程
• JS 引擎执行线程
• 事件触发线程
• 定时器触发线程
• http 请求线程

浏览器的渲染流程

1. 解析 html，建立 DOM 树
2. 解析 CSS，构建 CSSOM 树
3. 将 DOM 树和 CSSOM 树合并生成渲染树
4. 布局渲染树，计算每个元素的尺寸，位置
5. 调用 GUI 绘制，合并图层后显示

JS的运行机制(事件循环)

JS任务

• 同步任务：在主线程 (JS 引擎执行线程) 上排队执行的任务
• 异步任务：不进入主线程，而进入“任务队列”的任务。会被读取到执行栈中执行

任务队列

• IO 设备完成任务，就在任务队列中添加一个事件，表示相关的异步任务可以进入执行栈
• 用户产生的事件 (鼠标点