速通！Promise异步编程！以及Async/Await解析_promise.allsettled与async、await-CSDN博客

本文链接：https://blog.csdn.net/hnsfdxweb3/article/details/148724299

Promise介绍

Promise 是 JavaScript 中处理异步操作的核心机制，用于解决回调地狱（Callback Hell）问题。它表示一个异步操作的最终完成（或失败）及其结果值。

其中，它的构造函数是同步执行的，then / catch 方法是异步执行的。Promise创建后里面的函数会立即执行，构造函数中的resolve（.then）和reject（.catch）只有第一次执行有效，即Promise状态一旦改变就不能改变。

三种状态

Pending（待定）：初始状态，操作尚未完成
Fulfilled（已兑现）：操作成功完成
Rejected（已拒绝）：操作失败

状态一旦改变（fulfilled 或 rejected）就不可逆。

pedding初始状态

调用promise后，就会处于初始状态，此时resolve和reject均未执行，类似于接口的请求中

Fulfilled操作成功

resolve执行之后，promise则会从pedding变成fulfilled，其返回值可在.then方法的参数中获取到，

Rejected操作失败

rejected执行之后，promise则会从pedding变成Rejected，其错误信息可在.catch方法的参数中获取到

.finally()方法无论Promise执行成功或失败，都会执行

Promise的常用方法

1. `Promise.resolve()`

创建立即成功的 Promise

const resolved = Promise.resolve("成功值");

// 等同于
new Promise(resolve => resolve("成功值"));

//或 
const promise = new Promise((resolve, reject) => {
  resolve("成功值");
}
promise.then((res) => {
  console.log(res); //"成功值"
});

2. `Promise.reject()`

创建立即失败的 Promise

const resolved = Promise.reject("失败");

// 等同于
new Promise(resolve => reject("失败"));

//或 
const promise = new Promise((resolve, reject) => {
  reject("失败");
}

p.then((res) => {
  console.log(res); //未执行
}).catch((error) => {
  console.log(error); //"失败"
})

3. `Promise.all()`

并行执行多个 Promise，全部成功才算成功

const p1 = Promise.resolve(1);
const p2 = Promise.resolve(2);

Promise.all([p1, p2])
  .then(values => console.log(values)) // [1, 2]
  .catch(error => console.error(error));

4. `Promise.allSettled()`

等待所有 Promise 完成（无论成功失败），返回一个包含每个 Promise 解决状态的对象数组。

Promise.allSettled([p1, p2])
  .then(results => {
    results.forEach(result => 
      console.log(result.status) // "fulfilled" 或 "rejected"
    )
  });

5. `Promise.race()`

返回第一个完成的 Promise（无论成功失败）

const fast = new Promise(resolve => 
  setTimeout(() => resolve("快完成"), 100)
);

const slow = new Promise(resolve => 
  setTimeout(() => resolve("慢完成"), 500)
);

Promise.race([fast, slow])
  .then(winner => console.log(winner)); // "快完成"

6. `Promise.any()`

返回第一个成功的 Promise

const failFast = Promise.reject("错误");
const slowSuccess = new Promise(resolve => 
  setTimeout(() => resolve("成功"), 500)
);

Promise.any([failFast, slowSuccess])
  .then(firstSuccess => console.log(firstSuccess)); // "成功"

目前常用的处理异步的方法

Promise对象（上述方法），通过.then .catch .finally方法
Async/Await（首选现代方案）

Async/Await

Async/Await 是 ES2017 引入的 JavaScript 异步编程方案，它基于 Promise 构建，通过更直观的语法让异步代码拥有同步代码的可读性。

async 函数

声明一个函数始终返回 Promise
普通返回值会被自动包装为 resolved Promise

await 表达式

只能在 async 函数内部使用
暂停函数执行，等待 Promise 解决
返回 Promise 的解决值

简单应用

async function fetchData() {
  const data = await fetch('/api'); // 等待fetch完成
  return data.json();
}

业务实际应用

async function processOrder(orderId) {
  try {
    // 1. 等待订单获取
    const order = await getOrder(orderId);
    
    // 2. 并行获取用户和产品信息
    const [user, product] = await Promise.all([
      getUser(order.userId),
      getProduct(order.productId)
    ]);
    
    // 3. 顺序处理
    const payment = await processPayment(order);
    await sendConfirmation(user.email);
    
    return { status: 'completed', user, product };
  } catch (error) {
    // 统一错误处理
    await logError(error);
    throw new OrderError('处理订单失败');
  } finally {
    // 4. 最终清理
    releaseResources();
  }
}

其中