0

0

javascript如何理解事件循环与并发模型【教程】

夢幻星辰

夢幻星辰

发布时间:2026-01-29 16:40:02

|

498人浏览过

|

来源于php中文网

原创

JavaScript事件循环本质是单线程+任务队列+调用栈协作模型;setTimeout(0)不立即执行因回调入宏任务队列,须等同步代码和所有微任务(如Promise.then)执行完才执行。

javascript如何理解事件循环与并发模型【教程】

JavaScript 的事件循环不是“多线程并发”,它本质是单线程 + 任务队列 + 调用协作的模型;理解错这点,所有 setTimeout、Promise.then、await 行为都会误判。

为什么 setTimeout(0) 不会立刻执行

因为 setTimeout 的回调被放入「宏任务队列」,必须等当前调用栈清空、且所有微任务(如 Promise.then)执行完后,才轮到它。即使设为 0,也得排队。

  • 当前同步代码(比如 console.log)优先执行
  • 然后立即执行所有已入队的微任务(Promise.resolve().then()
  • 最后才从宏任务队列里取一个(比如那个 setTimeout 回调)
console.log(1);
setTimeout(() => console.log(2), 0);
Promise.resolve().then(() => console.log(3));
console.log(4);
// 输出:1 → 4 → 3 → 2

微任务 vs 宏任务:哪些属于哪一类

区分关键不在“快慢”,而在**执行时机优先级**:微任务总在每次宏任务结束后、渲染前集中清空;宏任务则按插入顺序,一次只取一个。

  • 微任务:Promise.then/catch/finallyqueueMicrotask()MutationObserver
  • 宏任务:setTimeoutsetIntervalsetImmediate(Node.js)、I/O 回调、UI 渲染触发的事件(如 click

注意:async/await 内部 await 后的代码,会被编译成 Promise.then,所以属于微任务。

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

CodeBuddy
CodeBuddy

腾讯云AI代码助手

下载

Node.js 和浏览器的事件循环有差异

浏览器没有明确的「check 阶段」或「close callback 阶段」,而 Node.js 的 libuv 事件循环分 6 个阶段,其中 process.nextTick() 甚至比微任务还早——它在每个阶段切换前立即执行,不属于 Promise 规范,但优先级最高。

  • process.nextTick() > 微任务 > setTimeout(即使为 0)
  • Node.js 中 setImmediate() 属于 check 阶段,在 I/O 回调之后、timers 之前;浏览器不支持该 API
  • 跨平台不要依赖 process.nextTicksetImmediate 的精确时序

实际调试中容易忽略的陷阱

很多人以为「事件循环 = 所有异步都靠它调度」,其实 DOM 渲染、网络请求、定时器底层都由浏览器/运行时单独线程处理,JS 主线程只负责接收回调并排队——也就是说,fetch() 本身不进事件循环,它的 .then() 才进。

  • 长时间同步代码(如 while(true))会完全阻塞事件循环,导致页面卡死、定时器延迟、Promise 不执行
  • requestIdleCallback 不是微任务,它在浏览器空闲时段执行,也不保证一定执行
  • 使用 Web Worker 是唯一真正脱离主线程的方式,但 Worker 里没有 DOM、没有 setTimeout(只有 self.setTimeout),事件循环逻辑独立

真正难的不是记住阶段顺序,而是意识到:所谓「异步」,只是把回调交出去排队;而「并发」在 JS 里从来不存在——只有协作式让出控制权。

相关文章

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

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

下载

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

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
while的用法
while的用法

while的用法是“while 条件: 代码块”,条件是一个表达式,当条件为真时,执行代码块,然后再次判断条件是否为真,如果为真则继续执行代码块,直到条件为假为止。本专题为大家提供while相关的文章、下载、课程内容,供大家免费下载体验。

95

2023.09.25

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

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

397

2023.07.18

堆和栈区别
堆和栈区别

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

575

2023.08.10

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

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

503

2023.08.10

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

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

166

2025.12.24

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

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

14

2026.01.21

C++多线程相关合集
C++多线程相关合集

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

15

2026.01.21

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

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

166

2025.12.24

clawdbot ai使用教程 保姆级clawdbot部署安装手册
clawdbot ai使用教程 保姆级clawdbot部署安装手册

Clawdbot是一个“有灵魂”的AI助手,可以帮用户清空收件箱、发送电子邮件、管理日历、办理航班值机等等,并且可以接入用户常用的任何聊天APP,所有的操作均可通过WhatsApp、Telegram等平台完成,用户只需通过对话,就能操控设备自动执行各类任务。

14

2026.01.29

热门下载

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

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 4.3万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 2.5万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3万人学习

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

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号