登录
首页 >  文章 >  前端

JS错误处理教程:trycatch使用详解

时间:2025-12-15 19:51:38 462浏览 收藏

推广推荐
免费电影APP ➜
支持 PC / 移动端,安全直达

小伙伴们有没有觉得学习文章很有意思?有意思就对了!今天就给大家带来《JS错误处理详解:try catch使用教程》,以下内容将会涉及到,若是在学习中对其中部分知识点有疑问,或许看了本文就能帮到你!

JavaScript错误处理核心是try...catch,需写全try、catch、finally三块;可捕获具体错误类型;需主动throw自定义错误;异步错误须用async/await或.catch()处理。

javascript错误处理怎么做_try catch语句如何使用

JavaScript 错误处理核心靠 try...catch,它能让你在代码出错时不崩溃,还能主动捕获和响应异常。

基本结构:三块必须写全

try 块放可能出错的代码,catch 捕获错误,finally(可选)无论成败都执行:

try {
  // 可能抛错的代码,比如 JSON.parse('invalid')
  let data = JSON.parse('{ "name": "Alice"');
} catch (error) {
  // error 是 Error 实例,有 message、name、stack 等属性
  console.error('解析失败:', error.message);
} finally {
  // 清理工作,比如关闭加载状态、释放资源
  console.log('不管成功失败,这行都会运行');
}

捕获具体错误类型,别只用通用 catch

不是所有错误都该一视同仁。可以判断 error.name 或用多个 catch(ES2022+ 支持)区分处理:

  • SyntaxError:JSON 解析失败、eval 语法错 → 提示用户检查输入格式
  • ReferenceError:访问未声明变量 → 检查拼写或作用域问题
  • TypeError:调用非函数、读取 null 属性 → 加空值校验再操作
  • Network-related errors(如 fetch 失败):需单独处理,因为 fetch 不会因 HTTP 状态码(如 404/500)抛错,得手动检查 response.ok

主动抛错 + 自定义错误,让问题更清晰

throw new Error('提示信息') 或自定义错误类,把业务逻辑中的非法状态转为可捕获错误:

function withdraw(balance, amount) {
  if (amount > balance) {
    throw new Error('余额不足');
  }
  return balance - amount;
}
<p>try {
withdraw(100, 150);
} catch (e) {
if (e.message === '余额不足') {
alert('请先充值');
}
}</p>

异步代码不能直接 try catch,要用 async/await 或 .catch()

Promise 和 async 函数里的错误不会被外层同步 try 捕获:

  • ✅ 正确写法(async/await):try { await fetch(...) } catch (e) { ... }
  • ✅ 正确写法(Promise 链):fetch(...).then(...).catch(...)
  • ❌ 错误写法:try { fetch(...) } catch (e) { ... } —— fetch 返回 Promise,本身不抛错

基本上就这些。关键不是“有没有 try catch”,而是“在哪加、加多细、错后怎么兜底”。

今天关于《JS错误处理教程:trycatch使用详解》的内容就介绍到这里了,是不是学起来一目了然!想要了解更多关于的内容请关注golang学习网公众号!

相关阅读
更多>
最新阅读
更多>
课程推荐
更多>