JS相关八股之什么是事件循环

在JavaScript中,"事件循环"(Event Loop)是一个非常重要的概念,它是指JavaScript引擎如何在单线程中处理异步操作的机制。单线程意味着在任意时刻,JavaScript代码只能执行一个任务。

一.事件循环的工作流程大致如下:

  1. 执行栈(Call Stack)

    • 当一个脚本开始执行时,它首先会进入执行栈。这里会按照顺序执行代码中的函数调用。
    • 执行栈是一个LIFO(后进先出)结构,最新添加到栈的任务会被首先完成。当前正在执行的函数将位于栈顶。
  2. 任务队列(Task Queue)

    • 当异步事件(如setTimeoutsetInterval、I/O、UI事件等)到达预定目标时,相应的回调函数会被放入任务队列。
    • 这些回调函数会等待当前执行栈中的所有任务都完成,即执行栈被清空。
  3. 事件循环

    • 一旦执行栈空了,事件循环就会从任务队列中取出排在最前面的任务,然后将其放入执行栈中去执行。
    • 这个过程是循环进行的,因此被称作"事件循环"。

二.宏任务与微任务:

在现代JavaScript引擎中,任务队列又被分为宏任务(Macro Task)队列和微任务(Micro Task)队列。

  • 宏任务 :包括setTimeoutsetInterval、I/O、UI事件等。
  • 微任务 :包括Promise的回调、Object.observe的变化回调、MutationObserver的回调等。

执行栈为空时,事件循环首先会检查微任务队列。如果微任务队列不为空,事件循环会连续执行微任务队列中所有的任务,直到微任务队列为空。之后,事件循环才会执行一个宏任务。完成宏任务后,事件循环又会检查微任务队列,这个过程会反复进行。

这种机制确保了微任务有更高的优先级和更快的响应时间,因为它们不需要等待下一轮事件循环。

事件循环是JavaScript实现异步编程的核心,它允许JavaScript引擎在执行长时间运行的任务时,仍然可以处理UI更新,接收用户输入,以及在合适的时间执行异步操作的回调。理解事件循环对于编写高效的异步代码至关重要。

相关推荐
悟能不能悟6 分钟前
java HttpServletRequest 设置header
java·开发语言
啊花是条龙10 分钟前
《产品经理说“Tool 分组要一条会渐变的彩虹轴,还要能 zoom!”——我 3 步把它拆成 1024 个像素》
前端·javascript·echarts
云栖梦泽11 分钟前
易语言运维自动化:中小微企业的「数字化运维瑞士军刀」
开发语言
刘975314 分钟前
【第23天】23c#今日小结
开发语言·c#
郝学胜-神的一滴24 分钟前
线程同步:并行世界的秩序守护者
java·linux·开发语言·c++·程序人生
superman超哥25 分钟前
Rust 移动语义(Move Semantics)的工作原理:零成本所有权转移的深度解析
开发语言·后端·rust·工作原理·深度解析·rust移动语义·move semantics
青茶36026 分钟前
【js教程】如何用jq的js方法获取url链接上的参数值?
开发语言·前端·javascript
superman超哥36 分钟前
Rust 所有权转移在函数调用中的表现:编译期保证的零成本抽象
开发语言·后端·rust·函数调用·零成本抽象·rust所有权转移
xiaowu08036 分钟前
C# 把dll分别放在指定的文件夹的方法
开发语言·c#
mg66844 分钟前
0基础开发学习python工具_____用 Python + Pygame 打造绚丽烟花秀 轻松上手体验
开发语言·python·学习·pygame