错误也是代码的一部分#

早年我习惯”能跑就行”，结果线上一个未捕获异常整页白屏。错误处理的本质：在预期会失败的地方，给程序一条退路。

错误类型#

• Error：基类，自定义错误继承它。
• TypeError：类型不对（如 null.foo）。
• ReferenceError：访问未声明变量。
• RangeError：数值越界（如递归爆栈）。
• SyntaxError：解析阶段就报错（不会被 try/catch 捕获）。

try/catch/finally#

1
try {
2
  const data = JSON.parse(input); // 可能抛 SyntaxError
3
} catch (e) {
4
  if (e instanceof SyntaxError) {
5
    console.error("格式错误", e.message);
6
  } else {
7
    throw e; // 不认识的往上抛
8
  }
9
} finally {
10
  cleanup(); // 无论成功失败都执行（关闭连接、释放资源）
11
}

catch 里别吞掉错误——至少打日志，或重新 throw。静默失败最可怕。

异步错误捕获#

1
// Promise
2
fetch(url).then(r => r.json()).catch(err => handle(err));
3

4
// async/await：用 try/catch 包住
5
async function load() {
6
  try {
7
    const r = await fetch(url);
8
    return await r.json();
9
  } catch (e) {
10
    report(e);
11
    throw e;
12
  }
13
}

注意：window.onerror / unhandledrejection 可兜住全局未捕获错误，用于监控上报。

调试实战#

• 断点：Sources 面板在可疑行点断点，看调用栈和变量。
• 条件断点：右键断点加条件，只在特定值时停。
• console 技巧：console.table 看数组、console.dir 看对象结构。
• Network：看请求状态、响应、Timing 定位慢请求。

小结#

• 错误分类型，自定义错误继承 Error。
• catch 别吞错，要么处理要么重抛；finally 做清理。
• 异步用 .catch / try-catch 包 await；全局兜底用 onerror / unhandledrejection。
• 调试靠断点 + 调用栈 + Network，比 console.log 高效。

练习#

1. 写 parseSafe(json, fallback)，解析失败返回 fallback 并打印错误类型。
2. 用 async/await + try/catch 改写一段 .then().catch() 链式。
3. 给页面加 window.addEventListener('unhandledrejection', ...) 上报未捕获 Promise 错误。