跳到主要内容

简述浏览器 JavaScript EventLoop 事件循环 ?

参考答案:

浏览器中的 JavaScript EventLoop 事件循环是 JavaScript 实现异步编程的核心机制。由于 JavaScript 是单线程的,这意味着它在执行代码时不能同时执行多个任务。然而,很多实际的应用场景需要处理一些耗时的操作,如网络请求、文件系统访问等,这些操作可能会阻塞主线程,从而影响用户体验。

为了解决这个问题,JavaScript 引入了事件循环机制。事件循环允许 JavaScript 在等待某些操作完成的同时,执行其他任务,从而避免了阻塞,提高了效率和并发性。

每个事件循环中都包含一个当前正在运行的任务(task 或者 null),一个微任务队列(microtask queue,初始值为空),以及一个执行微任务检查点的布尔值(初始值是 false,用于阻止微任务的可重入调用)。

事件循环的工作流程可以概括为以下几个步骤:

  1. 执行栈为空时,从任务队列中取出最早添加的任务来执行。
  2. 执行过程中,如果遇到异步任务(如 setTimeout、Promise等),则将其回调函数放入任务队列的末尾。
  3. 如果遇到微任务(如 Promise 的 then、catch、finally 方法,MutationObserver等),则将其放入微任务队列中。
  4. 在当前任务执行完毕后,会查看微任务队列是否有任务。如果有,会立即执行微任务队列中的所有任务,直到队列清空。
  5. 微任务执行完毕后,如果任务队列还有任务,则返回步骤 1。如果任务队列为空,则事件循环结束,等待下一个事件触发。

这种机制使得 JavaScript 可以在处理长时间运行的操作时,仍然保持流畅的用户体验。同时,它也使得开发者可以使用异步编程模型来处理复杂的、长时间运行的操作。