Promise 是 JavaScript 中的一种机制，用于处理异步操作的结果。它代表一个在未来可能完成或失败的操作的最终值。Promise 的引入使得 JavaScript 的异步代码更加清晰，并且比传统的回调函数更加易于维护和处理。

1、Promise 的三种状态

一个 Promise 对象有三种状态：

1. Pending（待定）：Promise 对象的初始状态，表示异步操作尚未完成。
2. Resolved/Fulfilled（已完成）：异步操作完成，且返回了期望的结果。
3. Rejected（已拒绝）：异步操作失败，且返回了错误原因。

这些状态在 Promise 内部管理，外部无法直接修改。

2、Promise 的基本用法

创建一个 Promise 对象时，传入一个执行器函数（executor function）。这个函数有两个参数：resolve 和 reject，它们分别表示操作成功和失败时的处理函数。

示例：

let promise = new Promise(function(resolve, reject) {
  let success = true;  // 模拟一个成功的操作

  if (success) {
    resolve("Operation was successful!");
  } else {
    reject("Operation failed!");
  }
});

promise.then(function(result) {
  console.log(result);  // 输出 "Operation was successful!"
}).catch(function(error) {
  console.log(error);   // 如果失败输出 "Operation failed!"
});

• resolve()：当异步操作成功时调用，将 Promise 状态从 pending 改为 resolved。
• reject()：当异步操作失败时调用，将 Promise 状态从 pending 改为 rejected。

3、Promise 的链式调用

一个 Promise 可以通过 .then() 方法处理成功的结果，或者通过 .catch() 方法处理失败的错误。 .then() 和 .catch() 方法返回的也是 Promise 对象，因此它们可以进行链式调用。

示例：

let promise = new Promise(function(resolve, reject) {
  resolve("Data fetched successfully!");
});

promise
  .then(function(result) {
    console.log(result);  // 输出 "Data fetched successfully!"
    return "Next step";  // 返回新的数据
  })
  .then(function(result) {
    console.log(result);  // 输出 "Next step"
  })
  .catch(function(error) {
    console.log(error);  // 如果有错误则输出
  });

• .then()：处理 Promise 成功的结果。
• .catch()：处理 Promise 拒绝（失败）的结果。
• 可以通过链式调用来依次处理多个异步操作。

4、Promise.all()

Promise.all() 方法接收一个包含多个 Promise 对象的数组，并返回一个新的 Promise。这个新的 Promise 在所有输入的 Promise 都变为 resolved 时变为 resolved，如果其中有任何一个 Promise 变为 rejected，则返回 rejected。

示例：

let promise1 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 1000, 'First');
});
let promise2 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 2000, 'Second');
});

Promise.all([promise1, promise2])
  .then(function(values) {
    console.log(values);  // 输出 ["First", "Second"]
  })
  .catch(function(error) {
    console.log(error);
  });

• Promise.all() 在所有的 Promise 都成功时，返回一个包含所有结果的数组。
• 如果任何一个 Promise 失败，整个 Promise.all() 会立即被拒绝，并且会执行 catch() 处理错误。

5、Promise.race()

Promise.race() 方法也接收一个 Promise 数组，并返回一个新的 Promise。这个新的 Promise 会在输入的 Promise 中最先完成的 Promise 完成时立即变为 resolved 或 rejected，不管其它的 Promise 是否已经完成。

示例：

let promise1 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 1000, 'First');
});
let promise2 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 2000, 'Second');
});

Promise.race([promise1, promise2])
  .then(function(value) {
    console.log(value);  // 输出 "First"，因为它第一个完成
  })
  .catch(function(error) {
    console.log(error);
  });

• Promise.race() 只会返回最先完成的 Promise。

6、Promise.finally()

finally() 方法允许你指定一个无论 Promise 最终是成功还是失败都会执行的回调函数。通常用于清理操作。

示例：

let promise = new Promise(function(resolve, reject) {
  resolve("Task completed");
});

promise
  .then(function(result) {
    console.log(result);
  })
  .catch(function(error) {
    console.log(error);
  })
  .finally(function() {
    console.log("This will run no matter what");
  });

• finally() 方法无论 Promise 状态如何，都会执行。

总结

• Promise 是 JavaScript 用来处理异步操作的对象，它有三种状态：pending、resolved（成功）和 rejected（失败）。
• 使用 then() 处理成功的结果，catch() 处理失败的情况，finally() 用于执行清理工作。
• Promise.all() 和 Promise.race() 用于处理多个 Promise。

更多详细内容请关注其他相关文章。