promise 和 async await的关系

A_wliang
244 阅读3分钟

Promise 和 async/await 是 JavaScript 异步编程中两种最常见的方法。它们的目的都是为了解决回调地狱（Callback Hell）的问题，使得异步代码更易读、更易维护。虽然两者都是用于处理异步操作，但是它们之间存在着一些关系和区别。

Promise

Promise 是一种异步编程的方式，它可以用来解决回调地狱的问题。Promise 代表一个异步操作的最终完成或失败，并返回结果。Promise 有三种状态：pending（等待中）、fulfilled（已完成）、rejected（已失败）。当 Promise 状态改变时，它会调用相应的回调函数。

下面是一个 Promise 的示例代码：

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    if (Math.random() > 0.5) {
      resolve("success");
    } else {
      reject(new Error("failure"));
    }
  }, 1000);
});

promise.then((result) => {
  console.log(result);
}).catch((error) => {
  console.error(error);
});

这段代码创建了一个 Promise，它会在 1 秒后随机地返回一个成功或失败的结果。使用 then() 方法处理 Promise 成功的结果，使用 catch() 方法处理 Promise 失败的结果。

async/await

async/await 是 ES2017 中引入的异步编程方式。它是建立在 Promise 之上的一种语法糖，使得异步代码更加易读、易写。async/await 通过使用 async 关键字声明异步函数，通过使用 await 关键字等待异步操作完成。

下面是一个 async/await 的示例代码：

async function test() {
  try {
    const result = await new Promise((resolve, reject) => {
      setTimeout(() => {
        if (Math.random() > 0.5) {
          resolve("success");
        } else {
          reject(new Error("failure"));
        }
      }, 1000);
    });
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

test();

这段代码使用了 async/await 来处理异步操作，通过 await 关键字等待 Promise 返回结果。如果 Promise 返回成功结果，则将结果保存在 result 中，并将其打印出来；如果 Promise 返回失败结果，则将错误信息保存在 error 中，并将其打印出来。

Promise 和 async/await 的关系

Promise 和 async/await 是紧密相关的两种异步编程方式。async/await 建立在 Promise 之上，它使用 Promise 来完成异步操作，并使用 await 关键字来等待 Promise 返回结果。Promise 通过返回一个 Promise 对象来处理异步操作，并通过 then() 和 catch() 方法来处理异步操作的结果。

下面是一个使用 async/await 和 Promise 的示例代码：

function asyncFunction() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if (Math.random() > 0.5) {
        resolve("success");
      } else {
        reject(new Error("failure"));
      }
    }, 1000);
  });
}

async function test() {
try { const result = await asyncFunction(); console.log(result); } catch (error) { console.error(error); } }

test();

这段代码中，asyncFunction() 返回一个 Promise 对象，test() 函数通过使用 await 关键字等待 asyncFunction() 函数返回结果。如果 asyncFunction() 函数返回成功结果，则将结果保存在 result 中，并将其打印出来；如果 asyncFunction() 函数返回失败结果，则将错误信息保存在 error 中，并将其打印出来。 可以看出，async/await 是建立在 Promise 之上的语法糖，它使得异步代码更加易读、易写，同时也使得代码结构更加清晰、易于维护。

总结

Promise 和 async/await 是 JavaScript 中最常用的两种异步编程方式。Promise 通过使用 then() 和 catch() 方法来处理异步操作的结果，而 async/await 通过使用 async 和 await 关键字来等待异步操作的结果。async/await 是建立在 Promise 之上的语法糖，它使得异步代码更加易读、易写，同时也使得代码结构更加清晰、易于维护。在实际开发中，我们可以根据需要选择合适的异步编程方式来处理异步操作。

avatar
文章
阅读
粉丝