什么是事件循环

JS中渲染分为同步任务和异步任务

  • 同步任务都在主线程上执行,形成一个执行栈
  • 异步任务通过回调函数来实现,通常用于处理耗时的,还有资源加载的场景
    • 异步任务都会被放入**任务队列(消息队列)**中

任务队列分为两种,一种是宏任务,一种是微任务

宏任务是指,在主线程中执行的较大任务,通常包括有:

  • setTimeout() 定时器
  • setInterval()
  • I/O操作
  • script脚本的渲染等

微任务是相对较小的异步任务

  • Promise的then和 catch方法

什么是事件循环机制

事件循环机制,就是,js在处理的时候

先执行执行栈中的同步任务,将异步任务放入到任务队列中

一旦执行栈中的所有同步任务执行完毕,系统就会按次序读取,检查微任务队列中是否被清空,如果还有微任务未执行,就先执行所有队列中的微任务(也就是将所有微任务压入执行栈中),然后再去执行宏任务,执行完毕当前宏任务之后,再去检查微任务队列,如此往复,直到任务队列被全部清空

因为JS是单线程的,为了防止阻塞页面,所以需要用到事件循环机制

相关推荐
—Qeyser3 分钟前
用 Deepseek 写的html油耗计算器
前端·javascript·css·html·css3·deepseek
萌萌哒草头将军6 分钟前
VsCode Colipot 🚗 + MCP Tools ✈️ = 让你的编程体验直接起飞 🚀🚀🚀
前端·visual studio code·mcp
前端付杰12 分钟前
Vue3 + Three.js 场景编辑器开发实践
开发语言·javascript·编辑器
萌萌哒草头将军12 分钟前
🚀🚀🚀MCP SDK 快速接入 DeepSeek 并添加工具!万万没想到MCP这么简单好用!
前端·javascript·mcp
CHQIUU25 分钟前
如何在PDF.js中改造viewer.html以实现PDF的动态加载
javascript·pdf·html
拉不动的猪1 小时前
简单回顾下useMemo
前端·javascript·面试
烛阴1 小时前
JavaScript 求幂运算符:告别 Math.pow(),拥抱更优雅的次方计算!
前端·javascript
染的人2 小时前
Layui Table组件,设置data数据源,以及page为False,表格只能显示10条数据的问题
前端·layui
玖玖passion2 小时前
js中的栈
前端·算法
只会安静敲代码的 小周2 小时前
【长按图片识别】uniapp vue开发时,点击图片识别—实现转发、收藏、识别图片二维码
前端·vue.js·uni-app