讲师中心 微信公众号
AI工具推荐 视频效率加速

什么是javascript事件循环机制_它怎样管理执行栈和任务队列

夏杰君_7623

夏杰君_7623

发布时间:2026-01-08 19:20:02

|

691人浏览过

|

来源于php中文网

原创

JavaScript事件循环是单线程下协调同步代码、宏任务与微任务执行顺序的规则:call stack清空后一次性执行所有微任务,再取下一个宏任务。

什么是javascript事件循环机制_它怎样管理执行栈和任务队列

JavaScript 事件循环机制不是“多线程调度器”,它本质是单线程下协调同步代码、宏任务和微任务执行顺序的规则。理解它,关键不在背流程图,而在搞清 call stack、macrotask queue 和 microtask queue 三者如何交接控制权。

call stack 清空后才检查 microtask queue

同步代码执行时,函数调用会不断压入 call stack;一旦栈顶函数返回,就弹出。只有当 call stack 完全为空时,引擎才会去读取 microtask queue(比如 Promise.then、MutationObserver 回调),并**一次性清空它**——注意:是“清空”,不是“取一个执行一个再看下一个”。

常见错误现象:

  • 在 setTimeout 回调里写多个 Promise.resolve().then(...),误以为它们会穿插在后续宏任务之间执行
  • 以为 await 后的代码属于“下一个 tick”,其实它只是被编译成 Promise 链,仍归微任务调度

实操建议:

立即学习“Java免费学习笔记(深入)”;

  • 用 console.log + 注释标记每个任务类型,比靠记忆更可靠
  • queueMicrotask 是显式插入微任务的标准 API,比手动 Promise.resolve().then 更语义清晰

macrotask queue 每次只取一个,执行完再查 microtask

宏任务包括:setTimeout、setInterval、I/O、UI 渲染、script 标签加载等。事件循环每次从宏任务队列取**第一个**执行,执行完后——不管这个宏任务内部又产生了多少新宏任务——都会立即转向微任务队列,清空所有待处理微任务,之后才回到宏任务队列取下一个。

Rydberg Agent Node
Rydberg Agent Node

使用一条命令部署ProbeChain Rydberg测试网代理节点。自动注册为Agent(NodeType=1),免gas,支持macOS/Linux/Windows。触发词:/r

下载

性能影响明显:

  • 大量 Promise 链或频繁 queueMicrotask 可能阻塞 UI 渲染,因为渲染本身是宏任务,得等当前微任务全部跑完才能轮到
  • setTimeout(fn, 0) 并不等于“立刻执行”,它只是尽快排进宏任务队列,实际要等当前同步代码 + 所有微任务都结束

示例对比:

console.log(1);
setTimeout(() => console.log(2), 0);
Promise.resolve().then(() => console.log(3));
console.log(4);

输出是 1 → 4 → 3 → 2,因为 2 是宏任务,3 是微任务。

不同浏览器/Node.js 对 microtask 的触发时机略有差异

规范要求微任务必须在每次宏任务结束后、下次宏任务开始前执行,但具体触发点有细节差别:

  • Chrome / Firefox 在每次事件循环迭代末尾清空微任务队列
  • Node.js v11+ 跟齐浏览器行为;v10 及以前在每个 I/O 回调后也清空一次微任务(导致某些 Promise 行为不一致)
  • requestIdleCallback 是宏任务,但它在浏览器空闲时段才执行,不受常规事件循环节奏约束

兼容性建议:

  • 避免依赖“微任务一定在某个 DOM 更新前执行”的假设,尤其涉及动画帧或 getBoundingClientRect
  • 用 queueMicrotask 替代 Promise.resolve().then 可减少 polyfill 差异

真正容易被忽略的是:事件循环不管理内存、不决定何时 GC、也不控制 fetch 或 WebSocket 的底层连接逻辑——它只管 JS 主线程上“谁该在什么时候拿到执行权”。把宏任务想成“一帧工作”,微任务就是这帧里的“即时响应补丁”,而 call stack 就是当前正在干的活儿。活儿干完,才轮到补丁,补丁打完,才接下一帧。

相关文章

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
讯飞绘文

讯飞绘文是一款由科大讯飞推出的一站式 AIGC 内容运营平台。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

立刻MV
立刻MV Hot

立刻MV是一款AI文本写作工具,AI 音乐视频(MV)创作工具。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

Lovart
Lovart Hot

一款面向视觉设计创作的AI设计平台,可通过智能体和画布工作流辅助制作海报、Logo、网页、PPT及其他视觉内容。

Atoms
Atoms Hot

Atoms是一款AI智能体工具,第一支自动构建真实业务的 AI 团队。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

讯飞智作

讯飞智作是一款AI视频创作工具,AI文本配音工具,数字人课程、营销视频制作。

音述AI
音述AI Hot

一款AI音频处理工具,主要用于音述AI是一个以“用声音述说故事”为核心的 AI 音乐创作与声音分享社区,适合需要提升相关任务效率的用户。

相关专题

更多
chrome什么意思
chrome什么意思

chrome是浏览器的意思,由Google开发的网络浏览器,它在2008年首次发布,并迅速成为全球最受欢迎的浏览器之一。本专题为大家提供chrome相关的文章、下载、课程内容,供大家免费下载体验。

2606

2023.08.11

chrome无法加载插件怎么办
chrome无法加载插件怎么办

chrome无法加载插件可以通过检查插件是否已正确安装、禁用和启用插件、清除插件缓存、更新浏览器和插件、检查网络连接和尝试在隐身模式下加载插件方法解决。更多关于chrome相关问题,详情请看本专题下面的文章。php中文网欢迎大家前来学习。

4919

2023.11.06

Chrome开启无痕模式
Chrome开启无痕模式

本专题整合了Chrome无痕模式开启相关内容,阅读专题下面的文章了解更多详细教程。

3527

2026.03.24

堆和栈的区别
堆和栈的区别

堆和栈的区别:1、内存分配方式不同;2、大小不同;3、数据访问方式不同;4、数据的生命周期。本专题为大家提供堆和栈的区别的相关的文章、下载、课程内容,供大家免费下载体验。

5307

2023.07.18

堆和栈区别
堆和栈区别

堆(Heap)和栈(Stack)是计算机中两种常见的内存分配机制。它们在内存管理的方式、分配方式以及使用场景上有很大的区别。本文将详细介绍堆和栈的特点、区别以及各自的使用场景。php中文网给大家带来了相关的教程以及文章欢迎大家前来学习阅读。

2328

2023.08.10

线程和进程的区别
线程和进程的区别

线程和进程的区别:线程是进程的一部分,用于实现并发和并行操作,而线程共享进程的资源,通信更方便快捷,切换开销较小。本专题为大家提供线程和进程区别相关的各种文章、以及下载和课程。

3918

2023.08.10

Python 多线程与异步编程实战
Python 多线程与异步编程实战

本专题系统讲解 Python 多线程与异步编程的核心概念与实战技巧,包括 threading 模块基础、线程同步机制、GIL 原理、asyncio 异步任务管理、协程与事件循环、任务调度与异常处理。通过实战示例,帮助学习者掌握 如何构建高性能、多任务并发的 Python 应用。

1089

2025.12.24

java多线程相关教程合集
java多线程相关教程合集

本专题整合了java多线程相关教程,阅读专题下面的文章了解更多详细内容。

383

2026.01.21

C++运算符基础入门
C++运算符基础入门

本专题详细讲解了C++运算符的类型、语法与使用方法,涵盖算术运算符、关系运算符、逻辑运算符、位运算符、赋值运算符、条件运算符及其他特殊运算符,并通过代码示例解析优先级与结合性。

0

2026.10.09

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.1万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.6万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn