当前位置：首页 > article >正文

ES6 — Promise基础用法（resolve、reject、then、catch,all）

article 2024/9/24 17:47:53

在 JavaScript 中，Promise 是一种用于处理异步操作的对象。它允许开发者以一种更清晰和更可控的方式来处理异步操作，避免回调地狱的问题。Promise 对象有以下几个状态：

Pending：初始状态，表示异步操作正在进行中。
Fulfilled：表示异步操作成功完成。
Rejected：表示异步操作失败。
Promise 对象提供了两个方法来改变其状态：resolve 和 reject。then 和 catch 方法用于处理 Promise 的成功和失败状态。all 方法用于等待一组 Promise 实例都完成。

以下是 Promise 的基础用法详解：

创建一个 Promise：使用 new Promise() 创建一个新的 Promise 对象，并传入一个函数作为参数。这个函数称为执行器（executor），它接受两个参数：resolve 和 reject。resolve 函数用于将 Promise 的状态设置为 fulfilled，而 reject 函数用于将 Promise 的状态设置为 rejected。

const promise = new Promise((resolve, reject) => {
  // 异步操作
  if (/* 异步操作成功 */) {
    resolve(/* 成功的结果 */);
  } else {
    reject(/* 失败的原因 */);
  }
});

使用 then 方法： then 方法用于处理 Promise 的 fulfilled 状态。它接受两个参数：一个函数用于处理成功的结果，另一个函数用于处理失败的结果（可选）。

promise.then((result) => {
  // 成功的回调函数
  console.log(result);
}, (error) => {
  // 失败的回调函数（可选）
  console.error(error);
});

使用 catch 方法： catch 方法用于处理 Promise 的 rejected 状态。它相当于只传入失败回调函数的 then 方法。

promise.catch((error) => {
  // 失败的回调函数
  console.error(error);
});

使用 all 方法： all 方法用于等待一组 Promise 实例都完成。它返回一个新的 Promise 对象，当所有的 Promise 实例都成功时，这个新的 Promise 对象才会成功；如果有任何一个 Promise 实例失败，那么这个新的 Promise 对象也会失败。

const promises = [promise1, promise2, promise3];
Promise.all(promises).then((results) => {
  // 所有 Promise 实例都成功时的回调函数
  console.log(results);
}).catch((error) => {
  // 任何一个 Promise 实例失败时的回调函数
  console.error(error);
});

使用 race 方法： race 方法用于等待一组 Promise 实例中的任意一个完成。它返回一个新的 Promise 对象，当第一个 Promise 实例完成时，这个新的 Promise 对象就会完成，无论其是成功还是失败。

const promises = [promise1, promise2, promise3];
Promise.race(promises).then((result) => {
  // 第一个 Promise 实例完成时的回调函数
  console.log(result);
}).catch((error) => {
  // 第一个 Promise 实例失败时的回调函数
  console.error(error);
});