登录
首页 >  文章 >  前端

JavaScript错误处理教程:try-catch用法详解

时间:2026-02-03 22:51:44 417浏览 收藏

一分耕耘,一分收获!既然打开了这篇文章《JavaScript错误处理:try-catch使用教程》,就坚持看下去吧!文中内容包含等等知识点...希望你能在阅读本文后,能真真实实学到知识或者帮你解决心中的疑惑,也欢迎大佬或者新人朋友们多留言评论,多给建议!谢谢!

try-catch只捕获运行时同步错误,不捕获异步错误;catch参数是标识符而非类型声明;finally总会执行且return会覆盖try/catch返回值;async/await中try-catch可捕获await的Promise拒绝。

javascript错误处理怎么做_如何使用try-catch语句

try-catch 会捕获哪些错误

它只捕获**运行时同步错误**,比如 ReferenceErrorTypeErrorSyntaxError(仅在 eval 中)、RangeError 等。异步操作(如 setTimeoutfetchPromise 链)抛出的错误不会被外层 try-catch 捕获。

  • ✅ 能捕获:
    try {
      console.log(undeclaredVariable);
    } catch (e) {
      console.log(e.name); // ReferenceError
    }
  • ❌ 不能捕获:
    try {
      setTimeout(() => {
        throw new Error('boom');
      }, 0);
    } catch (e) {
      // 这里永远不会执行
    }

catch 参数必须是变量名,不是类型声明

catch 后面的括号里写的是一个**标识符**,不是类型注解或构造函数名。写成 catch (Error e)catch (e: Error) 是语法错误(除非用 TypeScript 且开启 useUnknownInCatchVariables,但运行时仍只是普通变量)。

  • 正确写法:catch (e)catch (err)catch (error)
  • 错误写法:catch (Error e)catch (e instanceof Error)(语法报错)
  • 判断类型要用 instanceoftypeofcatch 块内做:
try {
  riskyOperation();
} catch (e) {
  if (e instanceof TypeError) {
    console.log('类型错了');
  } else if (e instanceof SyntaxError) {
    console.log('语法错了');
  }
}

finally 里的代码总会执行,但别在里面 return

finally 适合放清理逻辑(如关闭连接、重置状态),但它会覆盖 trycatch 中的 return 值——这是容易被忽略的行为。

  • 这个函数最终返回 'from finally',不是 'from try'
function test() {
  try {
    return 'from try';
  } catch (e) {
    return 'from catch';
  } finally {
    return 'from finally'; // ✅ 执行,且覆盖前面所有 return
  }
}
  • 如果只是想清理,就别写 return;真要返回值,得明确知道覆盖逻辑
  • finally 中抛错会中断原有流程,直接向上冒泡

async/await 场景下怎么用 try-catch

async 函数内部的 await 表达式,try-catch 是最自然的错误处理方式。它能捕获被 rejectPromise,等效于 .catch()

  • 推荐写法(清晰、可读性好):
    async function fetchUser() {
      try {
        const res = await fetch('/api/user');
        if (!res.ok) throw new Error(`HTTP ${res.status}`);
        return await res.json();
      } catch (e) {
        console.error('获取用户失败:', e.message);
        throw e; // 如果上层也要处理,记得 re-throw
      }
    }
  • 不推荐嵌套 .then().catch() 混用:await 后再链式调用会丢失堆栈、难调试
  • Promise.all 失败时,整个数组会被拒绝,需单独处理每个结果或用 Promise.allSettled
实际项目中,最容易漏掉的是异步错误边界和 finally 的返回覆盖行为。只要记住“try-catch 不进事件循环”和“finallyreturn 就赢”,就能避开大多数坑。

本篇关于《JavaScript错误处理教程:try-catch用法详解》的介绍就到此结束啦,但是学无止境,想要了解学习更多关于文章的相关知识,请关注golang学习网公众号!

前往漫画官网入口并下载 ➜
相关阅读
更多>
最新阅读
更多>
课程推荐
更多>