当前位置: 首页 > article >正文

7.Demo Js执行同步任务,微任务,宏任务的顺序(3)

一个包含 同步任务、微任务(Promise)、宏任务(setTimeout) 的例子,JS 是怎么调度这些任务的。

🎯 例子代码(建议复制到浏览器控制台运行)

console.log(‘同步任务 1’);

setTimeout(() => {
console.log(‘宏任务 1’);
}, 0);

Promise.resolve().then(() => {
console.log(‘微任务 1’);
});

console.log(‘同步任务 2’);

setTimeout(() => {
console.log(‘宏任务 2’);
}, 0);

Promise.resolve().then(() => {
console.log(‘微任务 2’);
});

console.log(‘同步任务 3’);

✅ 输出顺序是:

同步任务 1
同步任务 2
同步任务 3
微任务 1
微任务 2
宏任务 1
宏任务 2

🔍 为什么是这样?看执行顺序解析:

在这里插入图片描述

💡 如果你再加一个 await 会怎样?

async function test() {
console.log(‘async 1’);
await Promise.resolve();
console.log(‘async 2’);
}

test();

console.log(‘主线程’);

Promise.resolve().then(() => {
console.log(‘then’);
});

输出顺序:

async 1
主线程
then
async 2

解释:
• async 1 是同步部分,立即执行。
• await Promise.resolve() 会暂停 test() 剩下的部分,把后面的逻辑变成微任务。
• 主线程 是普通同步代码,立即执行。
• then 是微任务 → 执行
• async 2 也作为微任务 → 紧随其后执行

http://www.lryc.cn/news/2401135.html

相关文章:

  • 边缘计算网关赋能沸石转轮运行故障智能诊断的配置实例
  • 机器学习之深入理解机器学习常见算法:原理、公式与应用
  • Python实例题: Python 的简单电影信息
  • MyBatis 的动态 SQL
  • Redis中的setIfAbsent方法和execute
  • 高考数学易错考点02 | 临阵磨枪
  • 国产高性能pSRAM选型指南:CSS6404LS-LI 64Mb QSPI伪静态存储器
  • Go 中 `json.NewEncoder/Decoder` 与 `json.Marshal/Unmarshal` 的区别与实践
  • UE5 2D角色PaperZD插件动画状态机学习笔记
  • Ubuntu 16.04 密码找回
  • 【论文阅读】DanceGRPO: Unleashing GRPO on Visual Generation
  • CentOS在vmware局域网内搭建DHCP服务器【踩坑记录】
  • AI炼丹日志-28 - Audiblez 将你的电子书epub转换为音频mp3 做有声书
  • 图像处理篇---face_recognition库实现人脸检测
  • 74. 搜索二维矩阵 (力扣)
  • 8088单板机C语言sprintf()格式化串口输出---Prj04
  • 板凳-------Mysql cookbook学习 (九)
  • 深入解析 Flask 命令行工具与 flask run命令的使用
  • 第6篇:中间件 SQL 重写与语义分析引擎实现原理
  • 基于SpringBoot的“嗨玩旅游”网站设计与实现(源码+定制+开发)嗨玩旅游平台开发:景点展示与个性化推荐系统(SpringBoot)
  • python版若依框架开发:python版若依部署
  • React进阶:状态管理选择题
  • h5的aliplayer-min.js 加密视频会走到debugger
  • 第5篇《中间件负载均衡与连接池管理机制设计》
  • DashBoard安装使用
  • 极客大挑战 2019 EasySQL 1(万能账号密码,SQL注入,HackBar)
  • C# CallerMemberName特性
  • 采用 Docker GPU 部署的 Ubuntu 或者 windows 桌面环境
  • 关于面试找工作的总结(四)
  • 分布式拜占庭容错算法——实现工作量证明(PoW)算法详解