javascript如何处理错误与异常情况【教程】

javaScript错误处理应聚焦同步运行时异常，用try…catch兜底；异步错误需单独处理，fetch须检查response.ok并二次捕获response.json()异常；推荐用err.constructor.name判错型，必要时自定义Error子类提升语义精度。

javascript 中的错误处理不是靠“写得完美”来避免，而是靠 try...catch、throw 和合理的错误分类来兜住真实运行时的问题。

什么时候该用 try...catch？

它只对**同步代码中的运行时错误**有效，比如访问 undefined 的属性、调用不存在的方法、json 解析失败等。异步操作（如 fetch、setTimeout）里的错误不会自动冒泡进外层 try 块。

• 适合包裹：可能抛出异常的同步操作，例如 JSON.parse(input)、localStorage.getItem(key)（虽然不抛错，但值可能为 NULL）、正则 new regexp(pattern)
• 不适合包裹：纯逻辑判断、变量赋值、函数定义 —— 这些不会抛错，用 if 检查更直接
• 注意：try...catch 有轻微性能开销，不要把它当“万能 if”滥用

catch 块里怎么判断错误类型？

现代 JavaScript 中，catch 的参数（如 err）是 Error 实例，但不同错误来源的构造函数不同：网络请求失败是 TypeError，JSON 解析失败是 SyntaxError，手动抛出的可能是 Error 或自定义类。

• 用 err.constructor.name 判断类型，例如 err.constructor.name === 'SyntaxError'
• 避免只靠 err.message 字符串匹配，它不稳定（可能被本地化、格式变化）
• 对于 promise 链中的错误，必须用 .catch() 或 await + try...catch，不能依赖外层同步 try

如何安全地处理 fetch 请求失败？

fetch 只在网络完全断开或请求根本发不出时才 reject；http 状态码如 404、500 仍会 resolve，只是 response.ok 为 false。这是最容易踩的坑。

立即学习“Java免费学习笔记（深入）”；

• 必须检查 response.ok，再决定是否继续 response.json()
• response.json() 本身可能抛 SyntaxError（服务端返回非 JSON 内容），需要单独 try...catch
• 示例片段：

  try {   const res = await fetch('/api/data');   if (!res.ok) throw new Error(`HTTP ${res.status}`);   const data = await res.json(); // 这里可能 SyntaxError   return data; } catch (err) {   if (err.name === 'TypeError') console.error('网络异常');   else if (err.name === 'SyntaxError') console.error('响应不是合法 JSON');   else console.error('其他错误', err); }

要不要自定义错误类？

当多个模块抛出同类语义错误（比如“用户未登录”“权限不足”），用自定义错误类能让捕获和处理更精准，也方便日志分类。

• 继承 Error，并设置 this.name，否则 err.constructor.name 仍是 Error
• 示例：

  class AuthError extends Error {   constructor(message) {     super(message);     this.name = 'AuthError';   } } // 使用 throw new AuthError('Token expired');

• 注意：V8 引擎中，自定义错误的堆栈信息默认完整；但某些打包工具（如部分配置下的 webpack）可能抹掉 name，上线前建议实测

真正难的不是语法，而是想清楚哪一层该捕获、哪一层该透传、哪些错误该重试、哪些该降级 —— 这些取决于业务上下文，而不是 try 套得够不够深。