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

JavaScript如何工作_它的执行机制是怎样的

轻静吖_3686

轻静吖_3686

发布时间:2026-01-06 21:00:17

|

352人浏览过

|

来源于php中文网

原创

JavaScript是单线程、基于事件循环的解释型语言,核心在于call stack、Web APIs、task queue和microtask queue协同调度同步与异步任务,宏任务与微任务优先级不同,且Event Loop由宿主环境实现。

javascript如何工作_它的执行机制是怎样的

JavaScript 是单线程、基于事件循环(Event Loop)的解释型语言,它的执行机制核心不在于“多任务并行”,而在于“如何协调同步代码、异步回调与任务调度”。理解它,关键不是背概念,而是看清 call stackWeb APIstask queuemicrotask queue 四者怎么协作。

同步代码怎么一步步执行:call stack 是唯一真相

所有同步函数调用都压入 call stack,后进先出。一旦某函数抛错或返回,它立刻弹出;栈空了,JS 引擎才继续看下一步该做什么。

常见误解是以为 setTimeoutPromise 会“中断”当前执行——其实不会。它们只是把回调注册出去,自己立刻返回,不阻塞栈。

  • call stack 永远只跑同步逻辑,没有“暂停”“切片”概念
  • 递归过深直接触发 RangeError: Maximum call stack size exceeded
  • await 看似停顿,实际是语法糖:遇到 await 后,函数立即退出(返回 Promise),后续逻辑被编译成微任务塞进 microtask queue

异步回调分两类:macro task 和 micro task 的优先级差异

不是所有异步回调都一样。JS 规范明确区分了宏任务(macro task)和微任务(micro task),执行顺序直接影响结果。

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

Revealjs Presentations
Revealjs Presentations

创建、编辑并部署 reveal.js 演示文稿为单个 HTML 文件,可选自定义 CSS。适用于需要制作演示文稿、幻灯片或宣传材料时使用。

下载

典型 macro task:setTimeoutsetIntervalsetImmediate(Node.js)、I/O 回调;
典型 micro task:Promise.then/catch/finallyqueueMicrotaskMutationObserver 回调。

  • 每次 call stack 清空后,引擎先执行所有 microtask(直到队列为空),再取一个 macro task 执行
  • 这意味着连续的 Promise.resolve().then(...) 会比紧挨着的 setTimeout(..., 0) 先运行
  • Node.js 中 process.nextTick() 属于 microtask,但优先级高于 Promise 回调(仅限 Node)

浏览器环境里 Web APIs 怎么参与执行流程

JS 引擎本身不处理定时器、HTTP 请求或 DOM 事件——这些由浏览器的 Web APIs 模块接管。JS 只负责注册回调,然后继续往下跑。

例如:setTimeout(() => console.log('A'), 0) 被调用时,JS 引擎把回调交给 Timer 系统,自己立刻返回;等 Timer 到时,回调被推入 macro task 队列,等待下一轮 Event Loop 处理。

  • DOM 事件(如 click)触发后,事件处理函数作为 macro task 进入队列
  • fetch().then() 是 micro task;但 fetch() 本身发起请求是同步的,不等待响应
  • Web Workers 是真正的多线程,但主线程与 Worker 之间只能通过 postMessage 通信,消息处理仍是 Event Loop 机制

为什么 await + Promise.resolve() 不等于同步执行

很多人写 await Promise.resolve(42) 以为能“立刻拿到值”,但其实它仍会跳出当前函数、清空栈、再以微任务形式恢复执行。

console.log(1);
await Promise.resolve();
console.log(2);
// 输出:1 → (中间有微任务调度)→ 2
// 并非“同步连续打印”,中间可能穿插其他 microtask
  • await 总是导致函数退出并返回 pending Promise,哪怕右边是已 resolve 的值
  • 想真正同步执行,就别用 await;想模拟“同步感”,得靠 try/catch + Promise 链式错误传递,而非消灭异步性
  • 在 React 等框架中滥用 await 在渲染函数里,会导致组件挂起或状态不一致,因为渲染必须是同步且可中断的

最常被忽略的一点:Event Loop 不是 JS 引擎的私有机制,而是宿主环境(浏览器/Node)定义的协调协议。V8 只管执行 JS 代码、管理栈和 Promise 状态;谁来轮询队列、何时触发 timer、怎么调度 I/O——全由宿主决定。这也解释了为什么同一段代码,在浏览器和 Node 中的 microtask 执行时机可能略有差异。

热门AI工具

更多
讯飞智作

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

立刻MV
立刻MV Hot

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

DeepSeek

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

Loomy
Loomy Hot

一款AI工具,主要用于科大讯飞发布的桌面级 AI 助理,比 OpenClaw 更易用、更安全!,适合需要提升相关任务效率的用户。

Seko
Seko Hot

一款AI视频创作工具,主要用于商汤科技推出的创编一体的AI短视频创作Agent,适合需要提升相关任务效率的用户。

SkildArt
SkildArt Hot

SkildArt是一款AI文本写作工具,一站式 AI 视觉创作平台。

WorkBuddy

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

Lovart
Lovart Hot

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

豆包大模型

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

相关专题

更多
堆和栈的区别
堆和栈的区别

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

4547

2023.07.18

堆和栈区别
堆和栈区别

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

2088

2023.08.10

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

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

3478

2023.08.10

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

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

1009

2025.12.24

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

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

323

2026.01.21

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

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

479

2026.01.21

C# 多线程与异步编程
C# 多线程与异步编程

本专题深入讲解 C# 中多线程与异步编程的核心概念与实战技巧,包括线程池管理、Task 类的使用、async/await 异步编程模式、并发控制与线程同步、死锁与竞态条件的解决方案。通过实际项目,帮助开发者掌握 如何在 C# 中构建高并发、低延迟的异步系统,提升应用性能和响应速度。

329

2026.02.06

C++多线程并发控制与线程安全设计实践
C++多线程并发控制与线程安全设计实践

本专题围绕 C++ 在高性能系统开发中的并发控制技术展开,系统讲解多线程编程模型与线程安全设计方法。内容包括互斥锁、读写锁、条件变量、原子操作以及线程池实现机制,同时结合实际案例分析并发竞争、死锁避免与性能优化策略。通过实践讲解,帮助开发者掌握构建稳定高效并发系统的关键技术。

193

2026.03.16

Buffalo框架数据库开发全教程
Buffalo框架数据库开发全教程

本专题围绕Buffalo框架数据库开发,讲解database.yml多环境配置、soda与fizz迁移生成回滚、模型结构体标签、增删改查与条件查询、一对多与多对多关联、数据校验、回调钩子、事务处理及原生SQL执行能力。

0

2026.09.23

热门下载

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

精品课程

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

共58课时 | 11.9万人学习

国外Web开发全栈课程全集
国外Web开发全栈课程全集

共12课时 | 1.4万人学习

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

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