如何使用JavaScript处理错误_try-catch块和Promise.catch有什么区别呢-js教程-PHP中文网

如何使用JavaScript处理错误_try-catch块和Promise.catch有什么区别呢

php中文网

发布： 2025-12-14 11:03:07

原创

549人浏览过

JavaScript错误处理分同步和异步：try-catch捕获同步错误，.catch()或async/await+try-catch处理Promise异步错误；二者分工明确，不可替代，核心在于错误发生的执行上下文不同。

如何使用javascript处理错误_try-catch块和promise.catch有什么区别呢

JavaScript 中的错误处理主要有两种常见场景：同步代码用 try-catch，异步代码常用 .catch()（尤其是 Promise 链）。它们不是替代关系，而是分工明确——处理不同执行时机的错误。

try-catch 只捕获同步错误和当前执行栈内的错误

try-catch 无法捕获异步操作中抛出的错误（比如 setTimeout、Promise 内部的 throw、事件回调里的异常），因为这些错误发生在新的执行上下文中，已跳出 try 块的作用域。

例如：

千鹿Pr助手

智能Pr插件，融入众多AI功能和海量素材

128

查看详情

try {
  setTimeout(() => {
    throw new Error('这个错误不会被 catch 到');
  }, 0);
} catch (e) {
  console.log('永远不会执行这里');
}

登录后复制

✅ 正确用法是它适合处理：
- 函数内直接抛出的错误（JSON.parse(str) 失败）
- 明确知道会同步失败的操作（访问 undefined 属性、类型转换异常等）

Promise.catch 捕获异步链中的 rejected 状态和抛出的错误

.catch() 是 Promise 实例的方法，专门响应 Promise 被 reject 或在 .then() 回调中抛出的错误。它本质是 .then(null, rejectionHandler) 的语法糖。

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

例如：

fetch('/api/data')
  .then(res => {
    if (!res.ok) throw new Error('HTTP error');
    return res.json();
  })
  .catch(err => {
    // 这里能捕获 fetch 失败、HTTP 错误、JSON 解析异常、甚至上面 .then 里 throw 的错误
    console.error('请求或处理出错：', err);
  });

登录后复制

⚠️ 注意：
- async/await 函数内部仍可配合 try-catch 使用，因为 await 会让 Promise 的 rejection “冒泡”成同步可捕获的错误
- 但未被 .catch() 或 try-catch 捕获的 Promise rejection 会触发全局 unhandledrejection 事件，应监听避免静默失败

两者可以配合使用，但不能互相替代

实际项目中常混合使用：

用 try-catch 包裹 await 表达式（等价于 Promise 链的 .catch）
在 .then() 回调里用 try-catch 处理可能同步出错的子逻辑（如数据转换）
顶层加 window.addEventListener('unhandledrejection') 做兜底监控

比如：

async function loadData() {
  try {
    const res = await fetch('/api/user');
    const data = await res.json(); // JSON.parse 异常会被 try-catch 捕获
    return processData(data); // 这里如果 throw，也会被捕获
  } catch (err) {
    console.error('加载用户失败：', err);
  }
}

登录后复制

错误对象本身没有区别，关键是传播路径不同

不管是 throw new Error() 还是 Promise.reject(new Error())，错误对象结构一样（message、stack 等）。区别在于：
- 同步错误走 JavaScript 执行栈的“冒泡”机制，靠 try-catch 拦截
- Promise rejection 走 Promise 状态机的“传递”机制，靠 .catch() 或 await + try-catch 拦截

本质上，async/await 让异步错误“看起来像同步错误”，从而统一了错误处理风格。

基本上就这些。理解执行模型是关键——不是语法不同，而是错误发生时所处的“世界”不同。

以上就是如何使用JavaScript处理错误_try-catch块和Promise.catch有什么区别呢的详细内容，更多请关注php中文网其它相关文章！