17370845950

JavaScript错误处理核心是try...catch，用于捕获运行时异常而非语法错误、未处理Promise拒绝或异步回调错误；需在外部调用、DOM操作、异步请求及自定义校验等场景使用，避免空catch，善用finally清理资源并按错误类型分类处理。

JavaScript 错误处理核心靠 try...catch，它不会让错误直接中断脚本，而是给你机会“接住”并响应。关键不是避免所有错误，而是让错误发生时程序仍可控、用户不困惑、开发者能定位问题。

什么时候必须用 try catch

不是所有代码都需要包一层 try catch，重点在以下场景：

• 调用外部不可控的代码，比如第三方库函数、JSON.parse() 解析用户输入、localStorage.getItem() 读取可能损坏的数据
• 执行可能失败的 DOM 操作，例如 document.querySelector('#missing') 返回 null 后再调用 .addEventListener()
• 异步操作中使用 await（需放在 async 函数内），如 await fetch(url) 可能因网络失败抛错
• 手动校验逻辑失败时想抛出自定义错误，比如表单验证未通过就 throw new Error('邮箱格式不对')

基础写法和常见误区

语法很简单，但细节决定是否真正生效：

• try 块里只放可能出错的语句，别把大量无关逻辑塞进去，否则难以定位哪一行触发了异常
• catch 的参数名任意（如 err、error），但必须写，不能省略括号
• 错误对象至少有 message（人类可读信息）和 name（错误类型，如 "TypeError"），跨浏览器最稳的是只依赖 message
• 不要写成 Catch 或 CATCH——JavaScript 区分大小写，必须小写 catch

进阶用法：分类处理与资源清理

真实项目中，光“捕获+打印”远远不够：

• 按错误类型区别对待：比如 TypeError 通常是代码逻辑问题，应记录日志；NetworkError（需配合 fetch 状态判断）可提示“请检查网络”，并提供重试按钮
• 用 finally 做收尾工作：无论成功或失败都要关闭加载状态、释放定时器、取消未完成的请求（如 AbortController）
• 捕获后可选择“吞掉错误”（静默处理）、“上报错误”（发到监控平台）、或“重新抛出”（加一层上下文后再 throw err）
• 避免空 catch：catch(err) { } 看似安全，实则掩盖问题，至少加 console.error(err) 或上报

哪些错误 try catch 捕不到

它只捕获运行时异常（runtime errors），以下情况无效：

• 语法错误（SyntaxError）：比如少括号、多逗号，代码根本无法解析，try 还没开始执行就报错了
• Promise 中未被 await 或 .catch() 处理的拒绝（unhandled rejection）：需配合 window.addEventListener('unhandledrejection', ...) 兜底
• 异步回调里的错误（如 setTimeout(() => { null.toString(); })）：因为执行时机脱离了 try 块作用域
• 资源加载失败（如 ）：这类属于事件错误，要用 onerror 监听，而非 try catch