首页 > 文章 > 前端

asyncawait用法及错误处理详解

时间：2026-01-27 09:42:30 205浏览收藏

golang学习网今天将给大家带来《JavaScript中async await用法及错误处理》，感兴趣的朋友请继续看下去吧！以下内容将会涉及到等等知识点，如果你是正在学习文章或者已经是大佬级别了，都非常欢迎也希望大家都能给我建议评论哈~希望能帮助到大家！

async/await是基于Promise的现代异步语法，使代码更简洁可读；async函数返回Promise，await暂停执行但不阻塞线程；错误可用try/catch捕获，需注意作用域与并发处理。

JavaScript中async_await如何使用_错误如何捕获

async/await 是 JavaScript 中处理异步操作的现代写法，让异步代码看起来像同步代码一样清晰。它基于 Promise，但语法更简洁、可读性更强。错误捕获方式也和传统 try/catch 一致，不需额外学习新机制。

async/await 基本用法

函数前加 async 关键字，内部用 await 等待 Promise 完成。await 只能在 async 函数里用。

async 函数总是返回一个 Promise，即使你 return 一个普通值，也会被自动包装成 resolved 的 Promise
await 后面跟的是 Promise 实例（或任何值）；如果是非 Promise，会立即转成 resolved Promise
await 会暂停当前 async 函数的执行，但不会阻塞整个线程，其他任务照常运行

示例：

async function fetchUser() {
  const res = await fetch('/api/user');
  const user = await res.json();
  return user;
}

错误捕获：用 try/catch 包裹 await

await 抛出的异常（比如 Promise reject 或运行时错误）可以直接用标准的 try/catch 捕获，不需要 .catch() 链式调用。

网络请求失败、JSON 解析出错、await 后面的表达式抛异常，都会进入 catch 块
catch 接收的参数就是被 reject 的值（通常是 Error 实例）
如果没写 try/catch，错误会变成这个 async 函数返回的 Promise 的 rejection，需在调用处处理

示例：

async function fetchUser() {
  try {
    const res = await fetch('/api/user');
    if (!res.ok) throw new Error(`HTTP ${res.status}`);
    const user = await res.json();
    return user;
  } catch (err) {
    console.error('获取用户失败：', err.message);
    return null;
  }
}

多个 await 的错误边界要注意

每个 await 都可能出错，但 try/catch 是语句块级的。一个 try 块里多个 await，任一出错都会跳进 catch，后续 await 不再执行。

想独立处理每个异步操作的错误，就分开 try/catch
想按顺序执行且某步失败就中止，共用一个 try/catch 更合适
并发请求（如同时拉多个接口）建议用 Promise.all + await，并统一捕获整体失败

示例（并发 + 错误隔离）：

async function fetchAll() {
  const [userP, postP] = [
    fetch('/api/user').then(r => r.json()),
    fetch('/api/posts').then(r => r.json())
  ];
  try {
    const [user, posts] = await Promise.all([userP, postP]);
    return { user, posts };
  } catch (err) {
    // 任一请求失败都会到这里
    console.error('加载数据失败', err);
  }
}

常见陷阱与提醒

不要在顶层作用域（非函数内）直接写 await，会报语法错误；浏览器中可用模块顶层 await，但需 script type="module"
避免“await inside loop”导致串行变慢；需要并发时用 map + Promise.all
async 函数里忘记 await，会导致拿到的是 Promise 对象而非实际值，容易引发隐性 bug
reject 的错误如果没有被捕获，会在控制台显示未处理的 Promise rejection 警告

基本上就这些。async/await 让异步逻辑更贴近直觉，配合 try/catch，错误处理也回归到熟悉的模式。不复杂但容易忽略细节。

到这里，我们也就讲完了《asyncawait用法及错误处理详解》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！

前往漫画官网入口并下载 ➜