Promise Cheatsheet - Async JavaScript
JavaScript Promise 异步编程必备 API 都在这里了,从创建 Promise 到并发控制,按类别分类整理,写代码时直接复制。
Back to Languages基础用法 5
new Promise((resolve, reject) => { resolve(value) })创建并立即成功
new Promise((resolve, reject) => { reject(new Error("fail")) })创建并立即失败
Promise.resolve(value)直接创建已成功的 Promise
Promise.reject(reason)直接创建已失败的 Promise
new Promise((resolve) => setTimeout(resolve, 1000, "ok"))延时 1 秒后成功
消费 Promise 5
promise.then((result) => {})注册成功回调
promise.catch((error) => {})注册失败回调
promise.finally(() => {})无论成功失败都执行
promise.then(onFulfilled, onRejected)同时指定成功与失败回调
promise.then((v) => v + 1)then 返回值自动包装为新 Promise
静态方法 5
Promise.all([p1, p2])全部成功才成功,任一失败即失败
Promise.race([p1, p2])第一个完成(无论成败)的结果
Promise.allSettled([p1, p2])等待全部完成,返回每个结果状态
Promise.any([p1, p2])第一个成功的,全部失败才失败
Promise.allSettled 结果项为 { status, value } 或 { status, reason }结果对象结构
链式调用 4
fetch(url).then((r) => r.json()).then((data) => {})链式处理响应
promise.then(() => nextPromise())返回新 Promise 串联异步
promise.then((v) => v + 1).then((v) => console.log(v))返回值向下游传递
promise.catch((err) => fallback()).then((v) => {})错误恢复后继续链式
async/await 5
async function fn() { return value }async 函数自动返回 Promise
const result = await promise等待 Promise 完成
try { await promise } catch (err) {}用 try/catch 捕获拒绝
await Promise.all([p1, p2])并发等待多个任务
const [a, b] = await Promise.all([fa(), fb()])并发并解构结果
进阶模式 6
for (const item of items) { await process(item) }串行执行(逐个等待)
await Promise.all(items.map((i) => fetch(i)))并发执行全部任务
async function pool(tasks, limit) {}限制最大并发数
Promise.race([task(), timeout(5000)])超时控制(5 秒)
async function retry(fn, times = 3) {}失败自动重试
async function sleep(ms) { return new Promise((r) => setTimeout(r, ms)) }延时工具函数
取消与工具 6
const ac = new AbortController(); ac.abort()创建并触发中止信号
fetch(url, { signal: ac.signal })fetch 关联中止信号
ac.signal.addEventListener("abort", () => {})监听中止事件
AbortSignal.timeout(3000)3 秒后自动中止
queueMicrotask(() => {})把回调加入微任务队列
const d = {}; d.promise = new Promise((r, j) => { d.resolve = r; d.reject = j })deferred 模式(外部控制 resolve)
💡 Tips
- Promise 三种状态:pending(进行中)、fulfilled(已成功)、rejected(已失败),状态不可逆。
- then 返回新 Promise,链式调用中返回值会自动包装并传给下一个 then。
- catch 等同于 then(null, onRejected),能捕获链上任意位置的拒绝。
- Promise.all 适合全部必须成功;allSettled 适合需要全部结果;race 取最快;any 取首个成功。
- async/await 是 Promise 的语法糖,用 try/catch 处理错误更直观。