JavaScript Promise

在 JavaScript 中，Promise 是一种异步编程的解决方案，它代表一个在未来可能完成或失败的操作。Promise 可以帮助处理异步操作的回调地狱问题，并让代码更加清晰和易于维护。

1. Promise 的状态

每个 Promise 都有三种状态：

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

当 Promise 的状态从 Pending 变为 Fulfilled 或 Rejected 后，这个状态就不再变化（即 Promise 是不可逆的）。

2. 创建一个 Promise

可以通过 new Promise 来创建一个新的 Promise 对象。构造函数接收一个 executor 函数，executor 函数有两个参数：

resolve：用于表示成功完成时的操作。
reject：用于表示失败时的操作。

const myPromise = new Promise((resolve, reject) => {const success = true; // 模拟异步操作结果if (success) {resolve("操作成功！");} else {reject("操作失败！");}
});

3. 使用 `then` 和 `catch`

then：当 Promise 成功时调用，接收一个处理结果的回调函数。
catch：当 Promise 失败时调用，接收一个处理错误的回调函数。

myPromise.then((result) => {console.log(result); // "操作成功！"}).catch((error) => {console.error(error); // "操作失败！"});

4. 使用 `finally`

finally 方法会在 Promise 结束时，无论成功或失败都会执行，可以用于清理资源或结束操作。

myPromise.then((result) => {console.log(result);}).catch((error) => {console.error(error);}).finally(() => {console.log("操作结束");});

5. Promise 链式调用

多个异步操作可以通过链式调用的方式依次执行。每个 then 返回一个新的 Promise，所以可以继续调用下一个 then。

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

6. Promise 静态方法

JavaScript 提供了一些 Promise 的静态方法来简化多个 Promise 的管理：

Promise.all(iterable)：接收一个 Promise 可迭代对象，等待所有 Promise 完成后返回一个包含所有结果的数组。如果有任意一个 Promise 失败，则返回失败的 Promise。

const promise1 = Promise.resolve(1);
const promise2 = Promise.resolve(2);
const promise3 = Promise.resolve(3);Promise.all([promise1, promise2, promise3]).then((results) => {console.log(results); // [1, 2, 3]
});

Promise.race(iterable)：接收一个 Promise 可迭代对象，返回第一个完成的 Promise 的结果。

const promise1 = new Promise((resolve) => setTimeout(resolve, 100, "第一个完成"));
const promise2 = new Promise((resolve) => setTimeout(resolve, 200, "第二个完成"));Promise.race([promise1, promise2]).then((result) => {console.log(result); // "第一个完成"
});

Promise.allSettled(iterable)：接收一个 Promise 可迭代对象，等待所有 Promise 完成，不论结果是成功还是失败，返回每个 Promise 的结果对象数组。

const promise1 = Promise.resolve(1);
const promise2 = Promise.reject("失败");Promise.allSettled([promise1, promise2]).then((results) => {console.log(results);/*[{ status: "fulfilled", value: 1 },{ status: "rejected", reason: "失败" }]*/
});

Promise.any(iterable)：接收一个 Promise 可迭代对象，返回第一个成功的 Promise 的结果。如果所有 Promise 都失败，则返回 AggregateError。

const promise1 = Promise.reject("失败1");
const promise2 = Promise.resolve("成功");
const promise3 = Promise.reject("失败2");Promise.any([promise1, promise2, promise3]).then((result) => {console.log(result); // "成功"
});

7. 实用示例

function fetchData(url) {return new Promise((resolve, reject) => {setTimeout(() => {// 模拟异步请求const data = { user: "Alice", age: 25 };if (data) {resolve(data);} else {reject("数据加载失败");}}, 1000);});
}fetchData("https://api.example.com/user").then((data) => {console.log("获取的数据:", data);}).catch((error) => {console.error("发生错误:", error);});