Async/Await如何使用-js教程-PHP中文网

Async/Await如何使用

幻夢星雲

发布： 2025-08-12 15:57:01

原创

508人浏览过

async函数总是返回一个promise对象。1. 即使返回非promise值，也会被自动包装成已解决的promise；2. 错误处理通过try...catch块实现，捕获await表达式中被拒绝的promise；3. 与promise.all结合可并行执行多个异步操作，await等待所有promise解决，任一失败则进入catch块处理，从而提升并发性能。

Async/Await如何使用

Async/Await 是一种让异步代码看起来更像同步代码的语法糖。它极大地简化了异步编程的复杂性，使得代码更易于阅读和维护。本质上，

async

登录后复制

关键字用于声明一个异步函数，而

await

登录后复制

关键字用于暂停异步函数的执行，直到一个 Promise 对象被解决（resolved）或拒绝（rejected）。

使用 Async/Await 的核心在于理解

async

登录后复制

和

await

登录后复制

这两个关键字的作用。

async function myFunction() {
  try {
    const result = await someAsyncOperation();
    console.log("Result:", result);
    const anotherResult = await anotherAsyncOperation(result);
    console.log("Another Result:", anotherResult);
  } catch (error) {
    console.error("Error:", error);
  }
}

myFunction();

登录后复制

在这个例子中，

myFunction

登录后复制

被声明为

async

登录后复制

函数。

await someAsyncOperation()

登录后复制

会暂停

myFunction

登录后复制

的执行，直到

someAsyncOperation()

登录后复制

返回的 Promise 对象被解决。如果 Promise 被拒绝，那么会抛出一个异常，被

try...catch

登录后复制

块捕获。

Async/Await 比起传统的 Promise 链式调用，在代码可读性和错误处理方面都有显著的优势。

Async 函数的返回值是什么？

Async 函数总是返回一个 Promise 对象。即使你在函数中返回一个非 Promise 的值，JavaScript 引擎也会自动将其包装成一个已解决的 Promise。这意味着你可以像处理其他 Promise 一样处理 Async 函数的返回值。

async function getValue() {
  return 123;
}

getValue().then(value => {
  console.log("Value:", value); // 输出：Value: 123
});

登录后复制

这个特性使得 Async 函数可以无缝地与其他 Promise based 的 API 协同工作，增强了代码的灵活性。

如知AI笔记

如知笔记——支持markdown的在线笔记，支持ai智能写作、AI搜索，支持DeepseekR1满血大模型

查看详情

如何在 Async/Await 中处理错误？

错误处理是异步编程中一个关键的方面。Async/Await 提供了

try...catch

登录后复制

块来处理异步操作中可能出现的错误。将

await

登录后复制

表达式放在

try

登录后复制

块中，然后在

catch

登录后复制

块中捕获任何可能抛出的异常。

async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    return data;
  } catch (error) {
    console.error("Failed to fetch data:", error);
    // 可以选择重新抛出错误，或者返回一个默认值
    throw error;
  }
}

fetchData()
  .then(data => console.log("Data:", data))
  .catch(error => console.log("An error occurred."));

登录后复制

在

fetchData

登录后复制

函数中，如果

fetch

登录后复制

或

response.json()

登录后复制

抛出异常，

catch

登录后复制

块会捕获该异常，并进行处理。可以选择记录错误信息，或者重新抛出错误，让调用者来处理。

Async/Await 和 Promise.all 的结合使用？

Promise.all

登录后复制

可以并行执行多个 Promise，并在所有 Promise 都解决后返回一个包含所有结果的 Promise。结合 Async/Await 和

Promise.all

登录后复制

可以高效地处理需要并发执行的异步操作。

async function processData() {
  const urls = [
    'https://api.example.com/data1',
    'https://api.example.com/data2',
    'https://api.example.com/data3'
  ];

  try {
    const results = await Promise.all(urls.map(url => fetch(url).then(response => response.json())));
    console.log("Results:", results);
    // 在这里处理所有结果
  } catch (error) {
    console.error("Failed to fetch data:", error);
  }
}

processData();

登录后复制

在这个例子中，