JavaScript Promise 链

Promise 链是 JavaScript 中处理异步操作的一种强大模式，它允许你按顺序执行多个异步操作，并优雅地处理它们的成功或失败情况。

基本概念

Promise 链通过.then()、.catch()和.finally()方法连接多个 Promise：

doSomething()
  .then(result => doSomethingElse(result))
  .then(newResult => doThirdThing(newResult))
  .catch(error => console.error(error))
  .finally(() => console.log('操作完成'));

Promise 链的特点

1. 顺序执行：每个.then()中的回调会等待前一个 Promise 解决后才执行
2. 值传递：前一个.then()的返回值会传递给下一个.then()
3. 错误冒泡：链中的任何错误都会沿着链向下传递，直到遇到.catch()

构建 Promise 链

返回原始值

Promise.resolve(1)
  .then(value => {
    console.log(value); // 1
    return value + 1;
  })
  .then(value => {
    console.log(value); // 2
  });

返回 Promise

function asyncAdd(a, b) {
  return new Promise(resolve => {
    setTimeout(() => resolve(a + b), 100);
  });
}

asyncAdd(2, 3)
  .then(sum => {
    console.log(sum); // 5
    return asyncAdd(sum, 10);
  })
  .then(sum => {
    console.log(sum); // 15
  });

错误处理

使用 .catch()

Promise.reject(new Error('出错了!'))
  .then(value => {
    console.log('这不会执行');
  })
  .catch(error => {
    console.error(error.message); // "出错了!"
  });

链中的错误处理

doSomething()
  .then(result => {
    return doSomethingElse(result); // 假设这里出错
  })
  .then(newResult => {
    return doThirdThing(newResult); // 不会执行
  })
  .catch(error => {
    console.error('错误被捕获:', error);
  });

高级用法

并行执行 + 顺序处理

// 并行执行多个Promise
Promise.all([promise1, promise2, promise3])
  .then(([result1, result2, result3]) => {
    // 顺序处理结果
    return processResult(result1, result2, result3);
  })
  .then(finalResult => {
    console.log('最终结果:', finalResult);
  });

动态链

let promise = Promise.resolve();

[1, 2, 3].forEach(value => {
  promise = promise.then(() => {
    return asyncOperation(value);
  });
});

常见陷阱

1. 忘记返回 Promise：在.then()中如果忘记返回 Promise，链会中断

   // 错误示例
   doSomething().then(result => {
     doSomethingElse(result); // 忘记return
   }).then(newResult => {
     // newResult会是undefined
   });
   

2. 过度嵌套：避免不必要的嵌套，保持链扁平

   // 不推荐
   doSomething().then(result => {
     doSomethingElse(result).then(newResult => {
       // 嵌套过深
     });
   });
   

Promise 链是管理复杂异步逻辑的强大工具，合理使用可以使异步代码更清晰、更易维护。