JavaScript错误处理分同步和异步两类:同步错误用try...catch捕获,异步错误需用.catch()、async/await+try...catch或全局unhandledrejection/error事件处理,关键在于捕获位置准确。

JavaScript 错误处理主要分同步和异步两类:同步错误用 try...catch 捕获,异步错误(尤其是 Promise)需结合 .catch()、async/await + try...catch 或全局钩子来处理。关键不是“能不能捕”,而是“在哪儿捕”——位置错了,错误就漏掉了。
同步错误:用 try...catch 直接包裹可能出错的代码
try...catch 只能捕获**同步执行过程中抛出的错误**(比如 throw new Error()、类型错误、引用错误等),不能捕获异步回调里的错误(如 setTimeout 里抛错)。
- 把可能报错的语句放在
try块中,比如 JSON 解析、对象属性访问、函数调用 -
catch参数是错误对象,可访问message、name、stack等属性 - 可选
finally块,无论是否出错都会执行,适合清理资源
示例:
try {
const data = JSON.parse('{"name": "Alice",'); // 缺少 }
} catch (err) {
console.error('JSON 解析失败:', err.message); // SyntaxError: Unexpected end of JSON input
}
Promise 错误:用 .catch() 或 await + try...catch
Promise 链中的错误不会冒泡到外层 try...catch,必须显式处理。两种主流方式:
立即学习“Java免费学习笔记(深入)”;
-
链式
.catch():接在.then()后,捕获前面任意环节的 reject 或 throw -
async/await+try...catch:让异步代码写得像同步,错误可被直接捕获
注意:未被 .catch() 或 try...catch 处理的 Promise rejection 会触发 unhandledrejection 事件(可在全局监听)。
示例(推荐 await 方式):
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);
}
}
全局兜底:监听 unhandledrejection 和 error
用于捕获漏掉的 Promise 错误和全局同步错误(如脚本加载失败、语法错误),适合日志上报或友好的错误提示:
-
window.addEventListener('unhandledrejection', e => { ... }):捕获未处理的 Promise rejection -
window.addEventListener('error', e => { ... }):捕获未被捕获的同步错误(如加载失败、全局作用域 throw)
注意:error 事件不捕获 Promise 错误,unhandledrejection 不捕获同步错误,两者互补。
常见陷阱与建议
- 不要只在最外层包一层
try...catch就以为万事大吉——异步操作必须在对应上下文中处理 - 避免空
catch(即catch(e) {}),至少记录错误,否则问题会静默消失 - Promise 构造函数内部抛错会自动转为 rejection,但必须有
.catch(),否则算未处理 - 使用
async/await时,try必须包裹整个 await 表达式,不能只包await后面的部分
错误处理不是加一堆 try 就完事,而是理解执行模型、明确错误发生的位置,再选择合适的捕获时机和方式。不复杂但容易忽略。











