说一下事件循环机制【Event Loop】

往期回顾

webpack 做了哪些优化，在开发效率方面和打包策略方面

今日解题

JavaScript 是单线程的，单线程是指 js 引擎中解析和执行 js 代码的线程只有一个（主线程），在执行 ajax 请求中，主线程在等待响应的过程中会去做其他事情，浏览器先在事件表注册 ajax 的回调函数，响应回来后回调函数会被添加到任务队列中等待执行，不会造成线程阻塞，所以实现了 js 处理 ajax 请求的方式是异步的。
JavaScript 的任务分为两种：同步和异步，他们的处理方式各自不同：

• 同步任务是直接放在主线程上排队依次执行，
• 异步是放在任务队列中，若有多个异步任务，则需要在任务列表中排队等待，任务队列类似于缓冲区，任务下一步会被移到调用栈然后主线程执行调用栈任务。

  调用栈：调用栈是一个栈结构，函数调用会形成一个栈帧，帧中包含了当前执行函数的参数和局部变量等上下文信息，函数执行完后，它的执行上下文会从栈中弹出。

浏览器中的Event Loop

Micro-Task【微任务】与Macro-Task【宏任务】

浏览器端事件循环中的异步队列有两种：macro和micro.

• 常见的Macro-Task: setTimeout、script(整体)、I/O操作、UI渲染等
• 常见的Micro-Task: new Promise().then(回调)、MutationObserve等
• 浏览器会在当前执行栈执行完毕时立刻先 处理所有微任务队列中的事件，然后在去宏任务中取出一个事件。同一次事件循环中，微任务永远在宏任务之前执行。