JavaScript的try...catch仅捕获同步执行异常,不处理异步错误、语法错误、资源加载失败及Promise拒绝;需在调用处包裹且await异步操作,catch参数应命名避免覆盖Error,finally中避免return或throw。

JavaScript 的 try...catch 不是用来“兜底所有错误”的万能开关,它只捕获**同步执行中抛出的异常**,对异步错误、语法错误、资源加载失败(如 script 404)、Promise 拒绝(reject)默认不生效。
同步代码异常必须用 try...catch 包裹才被捕获
很多人以为只要写了 try...catch,函数里任何报错都会进 catch——其实不然。只有在 try 块内**实际执行时抛出的异常**才会被捕获。函数定义本身不出错,调用时才可能出错。
-
JSON.parse('{"name":}') // SyntaxError→ 放在try内会进catch -
undefined.foo()→ 放在try内会进catch -
function bad() { return x.y; }(未调用)→ 不会触发任何异常 -
bad()(调用后)→ 才会抛ReferenceError,且仅当它在try块中执行时才被捕获
catch 参数不是必须叫 err,但必须存在
ES2019+ 允许 catch 省略参数(即 catch{}),但此时你完全拿不到错误细节,基本等于“假装没发生”。真实项目中几乎不用。
- 推荐写法:
catch (error) { console.error(error.message); } - 注意:
error是运行时绑定的局部变量,不是全局Error构造函数 - 不要写成
catch (Error)——这会覆盖内置Error,后续throw new Error()可能报错 - 错误对象通常有
message、name、stack属性,stack对定位最有用
Promises 和 async/await 的错误不能靠外层 try...catch 自动捕获
这是最常踩的坑:把 fetch 或 axios 请求直接丢进 try,却不 await,结果 catch 完全不触发。
立即学习“Java免费学习笔记(深入)”;
- ❌ 错误写法:
try { fetch('/api'); } catch (e) { ... }→fetch返回 Promise,不 await 就不算“同步抛错” - ✅ 正确写法(async/await):
async function f() { try { const r = await fetch('/api'); } catch (e) { ... } } - ✅ 或 Promise 链:
fetch('/api').catch(e => { ... }) - 注意:
fetch本身只在网络失败时 reject;HTTP 4xx/5xx 不会 reject,需手动检查response.ok
finally 总是执行,但别在里面 throw 新错误
finally 适合做清理工作(如关闭 loading、释放锁、重置状态),但它会覆盖 try 或 catch 中的 return 或 throw。
- 如果
try中return 1,finally中return 2→ 整个函数返回2 - 如果
catch中throw new Error('a'),finally中又throw new Error('b')→ 外部只能看到'b','a'被吞掉 - 所以
finally里尽量只做无副作用的操作,避免return或throw
真正难的不是语法,而是判断该在哪一层加 try...catch:太深,业务逻辑被异常处理淹没;太浅,错误信息丢失上下文。多数时候,错误处理应该靠近具体操作(比如解析 JSON、调用某个 SDK 方法),而不是堆在入口函数里统一包一层。











