Promise通过三种状态（pending、fulfilled、rejected）和.then()、.catch()方法解决异步回调地狱问题，支持链式调用与Promise.all()并行处理，结合async/await更易读，但无法取消且需注意未捕获异常，相比Observable适用于一次性不可取消的操作。
Promise 主要用来解决 JavaScript 异步编程中回调地狱的问题，它提供了一种更清晰、更易于管理的方式来处理异步操作。
使用 Promise 的核心在于理解其三种状态：pending（进行中）、fulfilled（已成功）和 rejected（已失败），以及如何利用
.then()和
.catch()方法来处理异步操作的结果。
解决方案
-
创建 Promise 对象：
立即学习“Java免费学习笔记（深入）”；
首先，你需要创建一个 Promise 对象。Promise 构造函数接受一个函数作为参数，这个函数又接受两个参数：
resolve
和reject
。resolve
用于在异步操作成功时将 Promise 状态变为fulfilled
，reject
用于在异步操作失败时将 Promise 状态变为rejected
。const myPromise = new Promise((resolve, reject) => { // 模拟一个异步操作 setTimeout(() => { const success = true; // 假设操作成功 if (success) { resolve("操作成功！"); // 将 Promise 状态变为 fulfilled，并传递结果 } else { reject("操作失败！"); // 将 Promise 状态变为 rejected，并传递错误信息 } }, 1000); // 延迟 1 秒 }); -
使用
.then()
处理成功状态：使用
.then()
方法来处理 Promise 成功状态（fulfilled
）。.then()
接受一个回调函数作为参数，该回调函数会在 Promise 状态变为fulfilled
时被调用，并接收resolve
传递的结果。myPromise.then((result) => { console.log(result); // 输出 "操作成功！" }); -
使用
.catch()
处理失败状态：使用
.catch()
方法来处理 Promise 失败状态（rejected
）。.catch()
接受一个回调函数作为参数，该回调函数会在 Promise 状态变为rejected
时被调用，并接收reject
传递的错误信息。myPromise.catch((error) => { console.error(error); // 输出 "操作失败！" }); -
Promise 链式调用：
Promise 的强大之处在于可以进行链式调用。
.then()
方法会返回一个新的 Promise 对象，因此你可以继续使用.then()
或.catch()
方法来处理后续的异步操作。myPromise .then((result) => { console.log(result); // 输出 "操作成功！" return "继续处理..."; // 返回一个新的值，传递给下一个 .then() }) .then((nextResult) => { console.log(nextResult); // 输出 "继续处理..." }) .catch((error) => { console.error(error); // 输出 "操作失败！" }); -
使用
Promise.all()
并行处理多个 Promise：如果需要并行执行多个异步操作，可以使用
Promise.all()
方法。Promise.all()
接受一个 Promise 对象数组作为参数，它会等待所有 Promise 对象都变为fulfilled
状态，然后返回一个包含所有结果的数组。如果其中任何一个 Promise 对象变为rejected
状态，Promise.all()
也会立即变为rejected
状态。const promise1 = Promise.resolve(1); const promise2 = new Promise((resolve) => setTimeout(() => resolve(2), 200)); const promise3 = new Promise((resolve, reject) => setTimeout(() => reject('出错了'), 100)); Promise.all([promise1, promise2]) .then((values) => { console.log(values); // 输出 [1, 2] }) .catch((error) => { console.error(error); // 不会被执行，因为 promise3 被注释掉了 }); // 如果包含 reject 的 promise Promise.all([promise1, promise2, promise3]).then(values => { console.log(values); }).catch(err => { console.error(err); // 输出 出错了 })
Promise 的状态是如何转换的？
Promise 的状态转换只能由 pending 变为 fulfilled 或 rejected，且一旦状态发生改变，就无法再次改变。
resolve函数会将 pending 状态转换为 fulfilled 状态，
reject函数会将 pending 状态转换为 rejected 状态。如果在 Promise 构造函数中抛出错误，Promise 对象也会直接变为 rejected 状态。
async/await 如何简化 Promise 的使用？
async/await是 JavaScript 中用于处理异步操作的语法糖，它建立在 Promise 之上，可以使异步代码看起来更像同步代码。使用
async关键字声明的函数会隐式地返回一个 Promise 对象。在
async函数中，可以使用
await关键字来等待一个 Promise 对象变为 fulfilled 状态，并将结果返回。
async function myFunction() {
try {
const result = await myPromise; // 等待 myPromise 变为 fulfilled 状态
console.log(result); // 输出 "操作成功！"
const nextResult = await anotherAsyncFunction(result);
console.log(nextResult);
} catch (error) {
console.error(error); // 输出 "操作失败！"
}
}
myFunction();async/await使得异步代码更加易读和易于维护，减少了回调函数的嵌套，提高了代码的可读性。
Promise 的优势和局限性？
-
优势：
- 解决了回调地狱问题，提高了代码的可读性和可维护性。
- 提供了统一的异步操作处理方式，简化了异步编程的复杂性。
- 可以使用链式调用，方便地处理多个异步操作。
- 可以通过
Promise.all()
并行处理多个异步操作。 async/await
进一步简化了 Promise 的使用。
-
局限性：
- Promise 无法取消。一旦 Promise 对象创建，就无法停止其执行。
- 如果不设置回调函数，Promise 内部抛出的错误不会反映到外部。
- 当处于 pending 状态时，无法得知目前进展到哪个阶段（虽然可以通过一些库实现）。
如何处理 Promise 中未捕获的异常？
在 Promise 链中，如果某个 Promise 抛出了异常，但没有被
.catch()方法捕获，那么这个异常可能会被忽略，导致程序出现未知的错误。为了避免这种情况，建议在 Promise 链的末尾添加一个全局的
.catch()方法，用于捕获所有未处理的异常。
myPromise
.then((result) => {
// ...
})
.catch((error) => {
// 处理特定的错误
})
.catch((error) => {
console.error("全局错误处理:", error); // 捕获所有未处理的异常
});此外，可以使用
window.addEventListener('unhandledrejection', ...) 来监听未处理的 Promise rejection 事件，进行全局的错误处理。
Promise 与 Observable 的区别？
Promise 和 Observable 都是用于处理异步操作的，但它们之间存在一些重要的区别。
-
Promise:
- 一次性操作：Promise 只会 resolve 或 reject 一次。
- 不可取消：一旦 Promise 开始执行，就无法取消。
- 适用于处理单个异步操作。
-
Observable:
- 多次操作：Observable 可以多次发出值（类似于事件流）。
- 可取消：Observable 可以被取消，停止发出值。
- 适用于处理连续的异步操作，例如事件流、数据流。
Observable 提供了更强大的功能，例如可以进行过滤、转换、组合等操作，更适合处理复杂的异步场景。常用的 JavaScript 库 RxJS 实现了 Observable。
Promise 如何与回调函数结合使用？
虽然 Promise 旨在取代回调函数，但在某些情况下，仍然需要将 Promise 与回调函数结合使用。例如，某些旧的 API 仍然只支持回调函数，这时可以使用 Promise 来封装这些 API。
function callbackBasedApi(callback) {
setTimeout(() => {
const success = true;
if (success) {
callback(null, "操作成功"); // 成功时，第一个参数为 null，第二个参数为结果
} else {
callback("操作失败", null); // 失败时，第一个参数为错误信息，第二个参数为 null
}
}, 500);
}
function promiseBasedFunction() {
return new Promise((resolve, reject) => {
callbackBasedApi((error, result) => {
if (error) {
reject(error);
} else {
resolve(result);
}
});
});
}
promiseBasedFunction()
.then((result) => console.log(result))
.catch((error) => console.error(error));通过将基于回调的 API 封装成 Promise，可以更方便地使用 Promise 的链式调用和错误处理机制。
