JavaScript 中怎么通过 Promise 链式调用避免回调地狱-js教程-PHP中文网

promise链式调用通过每个then返回新promise实现平铺异步流程：用户数据→订单→物流，错误由catch统一捕获；避免在then内嵌套回调，正确做法是直接return新promise；async/await为其语法糖，提升可读性。

javascript 中怎么通过 promise 链式调用避免回调地狱

用 Promise 链式调用替代嵌套回调，核心是每次 then 返回一个新的 Promise，让后续操作接在它后面，而不是层层缩进写在回调里。

用 then 串联异步操作

每个 then 的回调函数返回值会自动包装成 Promise（除非返回的是 Promise 实例，那就直接使用它）。这样就能把多个异步步骤平铺展开：

第一次请求用户数据 → then 处理用户信息并发起第二个请求（如获取订单）
第二个请求完成 → then 处理订单并发起第三个请求（如查物流）
最后统一用 catch 捕获任意环节的错误

示例：

fetch('/api/user')
  .then(res => res.json())
  .then(user => fetch(`/api/orders?userId=${user.id}`))
  .then(res => res.json())
  .then(orders => fetch(`/api/tracking?id=${orders[0].trackingId}`))
  .then(res => res.json())
  .then(tracking => console.log(tracking))
  .catch(err => console.error('出错了：', err));

避免在 then 里写回调函数嵌套

常见错误是把下一个 fetch 写在 then 的回调内部再套 then，这又变回回调地狱。正确做法是让每个 then 只做一件事，并把下一步的 Promise 当作返回值：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

❌ 错误：在 then 里调用 fetch(...).then(...)，再在里面写逻辑
✅ 正确：then 回调直接 return fetch(...)，让链式结构自然延续

用 async/await 进一步简化（本质仍是 Promise 链）

虽然不是传统链式写法，但 async/await 是 Promise 链的语法糖，可读性更强，也彻底消除嵌套：

每个 await 等待一个 Promise 完成，之后代码继续向下执行，像同步一样
仍可用 try/catch 统一捕获异常，逻辑更清晰

等效写法：

async function getUserOrderTracking() {
  try {
    const user = await (await fetch('/api/user')).json();
    const orders = await (await fetch(`/api/orders?userId=${user.id}`)).json();
    const tracking = await (await fetch(`/api/tracking?id=${orders[0].trackingId}`)).json();
    console.log(tracking);
  } catch (err) {
    console.error('出错了：', err);
  }
}