Promise 基本概念

Promise 是 ES6 引入的一种异步编程解决方案，用于处理异步操作。它提供了一种更优雅的方式来管理回调地狱（Callback Hell），并支持链式调用。

Promise 是一个对象，代表一个异步操作的最终完成（或失败）及其结果值。它有三种状态：

• Pending（进行中）：初始状态，既不是成功，也不是失败。
• Fulfilled（已成功）：操作成功完成。
• Rejected（已失败）：操作失败。

通过 new Promise() 构造函数可以创建一个 Promise 对象。构造函数接受一个函数作为参数，该函数有两个参数：resolve 和 reject。

const promise = new Promise((resolve, reject) => {
  if (/* 异步操作成功 */) {
    resolve(value); // 状态变为 fulfilled
  } else {
    reject(error); // 状态变为 rejected
  }
});
 

---

Promise 的静态方法

Promise 提供了一些静态方法，用于处理多个 Promise 对象。

1. Promise.resolve()

Promise.resolve() 返回一个 resolved 状态的 Promise，参数可以是普通值或 Promise 对象。

Promise.resolve('success').then(value => console.log(value)); // 'success'
 

2. Promise.reject()

Promise.reject() 返回一个 rejected 状态的 Promise。

Promise.reject('error').catch(error => console.log(error)); // 'error'
 

3. Promise.all()

Promise.all() 接收一个 Promise 数组，全部成功时返回结果数组，有一个失败则立即 reject。

Promise.all([promise1, promise2])
  .then(values => console.log(values))
  .catch(error => console.log(error));
 

4. Promise.race()

Promise.race() 返回最先完成的 Promise 的结果（无论成功或失败）。

Promise.race([promise1, promise2])
  .then(value => console.log(value))
  .catch(error => console.log(error));
 

5. Promise.allSettled()

Promise.allSettled() 等待所有 Promise 完成，返回每个 Promise 的状态和结果。

Promise.allSettled([promise1, promise2])
  .then(results => console.log(results));
 

---

Promise 的应用场景

1. 异步请求封装
用 Promise 包装 XMLHttpRequest 或 fetch：

function fetchData(url) {
  return new Promise((resolve, reject) => {
    fetch(url)
      .then(response => response.json())
      .then(data => resolve(data))
      .catch(err => reject(err));
  });
}

2. 链式调用
通过 then 方法实现顺序异步操作：

getUser()
  .then(user => getOrders(user.id))
  .then(orders => processOrders(orders))
  .catch(error => console.error(error));

3. 并行执行
使用 Promise.all 处理多个并行异步任务：

Promise.all([fetchData(url1), fetchData(url2)])
  .then(results => console.log(results))
  .catch(error => console.error(error));

---

注意事项

错误捕获

• 未捕获的 Promise 错误可能导致程序静默失败。务必使用 catch() 或 try-catch（搭配 async/await）处理错误。

链式调用

• Promise 链式调用中，每个 then() 返回的 Promise 状态会影响后续调用。若未正确处理返回值或错误，可能导致逻辑中断。

状态不可逆

• Promise 状态一旦变为 fulfilled 或 rejected，就无法再改变。多次调用 resolve() 或 reject() 无效。

性能问题

• 过度嵌套 Promise 可能导致“回调地狱”。建议使用 async/await 或扁平化链式调用。

---

优化建议

合理使用 Promise.all()： 当需要并行执行多个不相关的异步操作时，使用 Promise.all() 可以提高效率。

避免不必要的嵌套： 尽量使用链式调用而非嵌套 then()，以保持代码扁平化。

使用 async/await： 在支持 ES7 的环境中，可以用 async/await 进一步简化 Promise 的使用，提升代码可读性。

内存泄漏处理： 长时间挂起的 Promise 可能导致内存泄漏，应设置超时机制或取消逻辑。

---

总结

Promise 是 JavaScript 异步编程的核心工具之一，提供了比传统回调更清晰和可维护的代码结构。通过合理使用链式调用、错误处理和并行操作，可以显著提升异步代码的质量和性能。随着 async/await 的普及，Promise 的重要性进一步凸显，成为现代 JavaScript 开发的必备技能。