try…catch仅捕获同步执行栈中的throw错误和运行时异常(如ReferenceError),不捕获SyntaxError、未await的Promise拒绝、事件/定时器回调错误;需配合await或.catch()处理异步错误,并辅以window.onerror和window.onunhandledrejection全局兜底。

try…catch 不能捕获异步错误、语法错误和 Promise 拒绝(除非显式 await)——这是最常被误用的点。
try…catch 能捕获什么,不能捕获什么
它只捕获当前执行栈中同步抛出的 throw 错误,以及运行时异常(如 ReferenceError、TypeError)。不捕获:
-
SyntaxError(脚本加载阶段就失败,根本进不了try块) - 未被
await的 Promise 拒绝(例如fetch().catch()没写,又没await,错误直接丢失) - 事件回调里的错误(如
button.addEventListener('click', () => { throw new Error(); })) - 定时器回调中的错误(
setTimeout(() => { throw new Error(); }, 100))
Promise 中正确使用 try…catch 的写法
必须配合 await 才能让拒绝态 Promise 触发 catch;否则要靠 .catch() 或 try…catch 包裹 await 表达式本身。
async function fetchData() {
try {
const res = await fetch('/api/data');
if (!res.ok) throw new Error(`HTTP ${res.status}`);
return await res.json();
} catch (err) {
console.error('请求或解析失败:', err.message);
// 这里能捕获 fetch 失败、JSON 解析异常、手动 throw
}
}注意:fetch() 本身不会因 HTTP 状态码(如 404/500)reject,需手动判断 res.ok 并 throw。
立即学习“Java免费学习笔记(深入)”;
全局错误兜底:window.onerror 和 window.onunhandledrejection
用来捕获 try…catch 漏掉的错误,是实际项目中必不可少的补救措施:
-
window.onerror:捕获同步脚本错误、资源加载失败(如 JS 文件 404) -
window.onunhandledrejection:捕获未被.catch()或try…await…catch处理的 Promise 拒绝
示例:
window.onerror = function(msg, url, line, col, error) {
console.error('全局同步错误:', { msg, url, line, col, stack: error?.stack });
return true; // 阻止默认错误提示
};
window.onunhandledrejection = function(event) {
console.error('未处理的 Promise 拒绝:', event.reason);
// 上报错误日志
};
不要在 catch 里吞掉错误却不记录
常见反模式:catch (e) { /* 空着 */ } 或只 console.log(e) 却没上报、没降级逻辑。生产环境应至少做到:
- 记录错误(
console.error+ 上报服务) - 提供用户可感知的反馈(如 toast 提示“操作失败,请重试”)
- 必要时 fallback 行为(如加载失败显示缓存数据)
另外,catch 块里再抛错要谨慎——若没上层捕获,会触发 onunhandledrejection 或 onerror,但容易形成重复上报。
异步错误边界比想象中更脆弱;真正健壮的错误处理,从来不是靠一层 try…catch,而是分层拦截 + 全局兜底 + 明确的错误归因路径。











