在 async 函数中，try catch 可捕获 await 的 Promise rejection，但 fetch 不因 404/500 reject，需手动检查 res.ok；axios 默认对非 2xx reject；须 await 每个异步操作并分层处理连接、HTTP、解析错误。
在 async 函数中用 try catch 捕获网络异常，关键在于 await 会把 Promise 的 rejection 转为同步抛出的错误，所以只要 await 一个可能失败的异步操作（比如 fetch），就能被外层 try catch 捕获。
确保 await 的是 Promise，并且它会 reject
不是所有异步操作都会自动触发 catch。例如：
- fetch 默认不会因 HTTP 状态码（如 404、500）而 reject，它只在网络断开、请求被取消、DNS 失败等真正“连接异常”时才 reject；
- 所以如果你要捕获 404 或 500，得手动检查 response.ok 或 status；
- axios 等库默认会在非 2xx 状态码时 reject，更适合直接配合 try catch。
基础写法：try catch 包裹 await 表达式
这是最常用也最安全的方式：
async function fetchData() {
try {
const res = await fetch('https://api.example.com/data');
if (!res.ok) {
throw new Error(`HTTP error! status: ${res.status}`);
}
const data = await res.json();
return data;
} catch (err) {
console.error('请求失败：', err.message);
// 这里能捕获：
// - 网络中断、跨域拒绝、URL 无效等 fetch reject
// - 上面手动 throw 的 HTTP 错误
// - JSON 解析失败（res.json() reject）
}
}处理多个 await 步骤的异常来源
每个 await 都可能出错，建议按步骤分层判断：
立即学习“Java免费学习笔记（深入）”；
- 第一个 await fetch：捕获连接层错误（TypeError、AbortError）；
- 检查 res.ok：捕获业务层 HTTP 错误（4xx/5xx）；
- 第二个 await res.json()：捕获响应体解析错误（如返回了 HTML 或空字符串）；
- 必要时给 fetch 加 signal 实现超时或取消，其 reject 也会进 catch。
避免常见陷阱
这些写法容易漏掉错误：
- ❌
fetch(...).then(...).catch(...)在 async 函数里——这会吞掉错误，无法被外层 try catch 捕获； - ❌ 忘记 await：写成
const res = fetch(...)，那 res 是 Promise 对象，不会触发 catch； - ❌ 只依赖 fetch 自带 reject，却不处理 404/500 —— 用户看到“无响应”，实际后端已报错。
