Promise与async/await实战教程

本篇文章给大家分享《异步JS Promise与async/await使用教程》，覆盖了文章的常见基础知识，其实一个语言的全部知识点一篇文章是不可能说完的，但希望通过这些问题，让读者对自己的掌握程度有一定的认识(B 数)，从而弥补自己的不足，更好的掌握它。

Promise 和 async/await 是同一异步机制的底层抽象与语法糖；Promise 是状态容器（pending/fulfilled/rejected），async 函数返回 Promise，await 暂停执行但不阻塞主线程；错误处理、并发控制和未捕获 rejection 是关键难点。

Promise 和 async/await 不是“替代关系”，而是同一套异步机制的两种表达方式：Promise 是底层抽象，async/await 是它的语法糖。直接用 async/await 更简洁，但不理解 Promise 就容易在错误处理、并发控制或调试时掉坑里。

Promise 是什么，为什么不能直接 return 值

JavaScript 主线程是单线程的，耗时操作（如网络请求、文件读取）不能阻塞执行。Promise 就是用来“承诺未来某个时刻给出结果”的对象——它不是值，而是一个状态容器：pending（进行中）、fulfilled（成功）、rejected（失败）。

常见错误：写 return fetch('/api/user').then(res => res.json())，以为返回的是 JSON 数据；实际返回的是一个 Promise 对象。调用方必须用 .then() 或 await 才能拿到最终值。

关键点：

• Promise 构造函数接收一个执行器函数，该函数立即执行，并传入 resolve 和 reject 两个回调
• Promise.resolve(value) 把普通值包装成已 fulfilled 的 Promise；Promise.reject(err) 同理
• 链式调用中每个 .then() 返回的新 Promise，其状态由该回调的返回值决定（返回 Promise 则等待它；返回普通值则自动 resolve）

async/await 怎么写，和 .then() 有什么区别

async 函数本质就是返回 Promise 的函数；await 只能在 async 函数内使用，它会让 JS 引擎暂停当前函数执行（不阻塞主线程），等右侧的 Promise settle 后继续。

对比写法：

function getUser() {
  return fetch('/api/user')
    .then(res => res.json())
    .then(data => data.name);
}

async function getUser() {
  const res = await fetch('/api/user');
  const data = await res.json();
  return data.name;
}

区别不只是写法更像同步代码——更重要的是错误捕获方式不同：

• .then().catch() 容易漏掉中间环节的异常（比如 res.json() 抛错没被 catch）
• await 配合 try/catch 能自然捕获任意一步的 rejection，包括语法错误、类型错误（只要发生在 await 表达式求值过程中）
• 但注意：try/catch 捕不到 Promise 内部未处理的 rejection（比如忘记 await 一个 Promise 并让它跑飞）

并发请求怎么控制，Promise.all 和 Promise.allSettled 选哪个

多个请求不需要串行时，别写成 await a(); await b(); await c(); ——这会变慢三倍。用 Promise.all([a(), b(), c()]) 并发发起。

但要注意：Promise.all 是“全成功才成功”，任一 Promise reject，整个就立刻 reject，其余还在跑的请求不会取消（只是结果被丢弃）。如果想等所有都结束再统一处理（不管成败），用 Promise.allSettled。

示例场景：

• 表单提交 + 上传头像 + 记录日志 → 用 Promise.all，任一失败整个提交失败
• 批量拉取用户资料（容忍个别失败）→ 用 Promise.allSettled，之后过滤出 status: 'fulfilled' 的结果
• 需要超时控制？得手动封装：Promise.race([fetch(...), timeout(5000)])

容易被忽略的陷阱：未处理的 rejection 和内存泄漏

Node.js 环境下，未被 .catch() 或 try/catch 捕获的 Promise rejection 会触发 unhandledrejection 事件，在新版 Node 中默认抛出未捕获异常，导致进程退出。浏览器里虽不崩溃，但会在控制台报 Uncaught (in promise)。

典型漏捕场景：

• 事件监听器里发起请求但没加 try/catch（如 button.addEventListener('click', async () => { await apiCall(); })）
• 定时器或轮询中反复创建 Promise，但某次失败后没清理后续调用（造成重复请求堆积）
• 用 Promise.all 时只在最外层 catch，但内部某个 Promise 的错误本应单独告警或降级

真正难调试的，往往是那些“看起来跑过去了”但实际被吞掉的错误——它们不会中断流程，却让数据不一致或 UI 卡在 loading 状态。

本篇关于《Promise与async/await实战教程》的介绍就到此结束啦，但是学无止境，想要了解学习更多关于文章的相关知识，请关注golang学习网公众号！