快速理解 JavaScript 中的 Promise

JavaScript 中的 Promise 是表示异步操作最终完成（或失败）及其结果值的对象。它们是 JavaScript 中的一个基本概念，使处理异步操作变得更加容易，而无需阻塞剩余的代码。本文旨在提供对 Promise 的全面理解，包括它们的使用和好处。

Promise 有以下几种状态：

Pending：初始状态，既不是 fulfilled，也不是 rejected。
Fulfilled ：也叫resolved，表示操作成功。
Rejected：操作失败。

如果 Promise 已经 fulfilled 或 rejected，但不是 pending，那么它就是 settled 的。

创建 Promise

使用 Promise 构造函数创建一个 Promise，它接受一个单个参数，即一个带有两个参数的函数：resolve 和 reject，它们都是函数。

javascript 复制代码

let promise = new Promise(function(resolve, reject) {
  // 异步操作
});

解决 Promise

当操作成功时，我们调用 resolve 函数，Promise 被兑现为一个值。

javascript 复制代码

let promise = new Promise(function(resolve, reject) {
  setTimeout(() => resolve("完成！"), 1000); // 异步操作
});

promise.then((value) => console.log(value)); // 1 秒钟后显示 "完成！"

拒绝 Promise

如果操作失败，我们调用 reject 函数，Promise 被拒绝并附带一个理由（通常是一个 Error 对象）。

javascript 复制代码

let promise = new Promise(function(resolve, reject) {
  setTimeout(() => reject("失败！"), 1000); // 异步操作
});

promise.catch((error) => console.log(error)); // 1 秒钟后显示 "失败！"

链接 Promise

Promise 最强大的特性之一是能够链接它们。这允许我们一个接一个地执行一系列的异步操作。

javascript 复制代码

new Promise(function(resolve, reject) {
  setTimeout(() => resolve(1), 1000); // 1 秒钟后返回 1
})
.then(function(value) {
  console.log(value); // 1
  return value + 1;
})
.then(function(value) {
  console.log(value); // 2
});

错误处理

Promise 提供了一种清晰的方式来处理错误，使用 catch 方法。如果在执行 Promise 时抛出任何错误，它将被最接近的 catch 方法下的链接捕获。

javascript 复制代码

new Promise(function(resolve, reject) {
  throw new Error("失败！");
})
.catch(function(error) {
  console.log(error.message); // "失败！"
});

Promise.all 和 Promise.race

Promise.all 接受一个 Promise 的可迭代对象，并返回一个新的 Promise，该 Promise 在所有输入的 Promise 都解决时解决，或者在其中一个输入的 Promise 被拒绝时拒绝。

javascript 复制代码

let urls = ['https://api.github.com/xxx', 'https://api.github.com/users/xxxx'];
Promise.all(urls.map(url => fetch(url).then(response => response.json())))
.then(users => console.log(users));

Promise.race 返回一个 Promise，一旦迭代中的一个 Promise 解决或拒绝，该 Promise 就会解决或拒绝。

javascript 复制代码

let promise1 = new Promise(resolve => setTimeout(resolve, 500, 'one'));
let promise2 = new Promise(resolve => setTimeout(resolve, 100, 'two'));

Promise.race([promise1, promise2]).then(value => console.log(value)); // "two"

总的来说，JavaScript 中的 Promise 提供了一个健壮的机制来处理异步操作，使你的代码更加可读和可维护。它们提供了一种清晰的方式来处理成功和失败的情况，并允许将多个异步操作优雅地链接在一起。了解 Promise 对于任何处理异步编程的 JavaScript 开发人员都是必不可少的。