用async/await处理多级异步依赖，应拆分为职责单一的独立async函数，用await顺序表达串行依赖、Promise.all并发无关请求，配合try/catch捕获错误，辅以retry、timeout等工具函数提升健壮性。
用 async 与 await 处理多级异步依赖，核心是让“等待”变自然、让“错误”可捕获、让“依赖关系”清晰表达，而不是嵌套 Promise.then 或写一堆回调。
把每个异步步骤封装成独立的 async 函数
拆分逻辑，让每一步职责单一，便于复用和测试。比如获取用户 → 获取用户订单 → 获取订单商品详情，就该分成三个函数：
✔ 好写法：
async function fetchUser(id) { /* 返回 user */ }
async function fetchOrders(userId) { /* 返回 order 列表 */ }
async function fetchProduct(productId) { /* 返回商品信息 */ }✘ 避免在同一个函数里混着 fetch + JSON.parse + 重试逻辑
立即学习“Java免费学习笔记（深入）”；
用 await 顺序表达依赖，用 try/catch 捕获中间失败
层级越深，出错位置越难定位。直接 await 上一步结果，错误会自然抛到当前作用域：
async function loadUserProfileWithProducts(userId) {
try {
const user = await fetchUser(userId);
const orders = await fetchOrders(user.id);
const productPromises = orders.map(order => fetchProduct(order.productId));
const products = await Promise.all(productPromises);
<pre class="brush:php;toolbar:false;">return { user, orders, products };} catch (err) { console.error('加载用户资料失败：', err.message); throw err; // 或返回默认值、空对象等 } }
注意：Promise.all 会因任一 promise reject 而整体失败；如需“尽力而为”，改用 Promise.allSettled。
对并行依赖用 Promise.all，对串行依赖用 await 链式调用
识别哪些请求彼此无关（可并发），哪些必须等前一个结果才能发起：
- ✅ 用户头像、用户基本信息、用户偏好设置 —— 可并行：
await Promise.all([fetchAvatar(), fetchProfile(), fetchPrefs()]) - ✅ 先查订单 ID，再查每个订单的物流状态 —— 必须串行或先收集 ID 再批量查
- ⚠️ 不要写
await fetchA(); await fetchB(); await fetchC();如果 B 和 C 不依赖 A 的结果 —— 浪费时间
用工具函数简化常见模式（如重试、超时）
避免重复写 try/catch + setTimeout。封装可复用的辅助函数：
// 带重试的 await 版本
async function retry(fn, max = 3) {
for (let i = 0; i < max; i++) {
try {
return await fn();
} catch (e) {
if (i === max - 1) throw e;
await new Promise(r => setTimeout(r, 100 * (i + 1)));
}
}
}
<p>// 使用示例
const data = await retry(() => fetch('/api/data')); // 自动重试 3 次类似地，可以封装 timeout(fn, ms) 给任意异步操作加超时保护。
