JS - 错误处理

try...catch

同步捕获运行时错误:

js 复制代码
try {
    // 代码...
} catch (err) {
    // 错误捕获
}

Error 对象

err 也就是 Error 对象主要有两个属性 namemessage,还有 stack 属性,它包含有关函数调用的信息,可以用于调试。

不需要 error 的具体信息时,可以省略参数,catch { }即可。

可以自己抛出 error,比如 throw new Error('o_O'),它的 name 就是 Error,message 就是 o_O。

js 复制代码
let json = '{ "age": 30 }' // 不完整的数据

try {
    let user = JSON.parse(json) // <-- 没有 error
    if (!user.name) {
        throw new SyntaxError('数据不全:没有 name') // (*)
    }
    alert(user.name)
} catch (err) {
    alert('JSON Error: ' + err.message) // JSON Error: 数据不全:没有 name
}

rethrowing

catch 应该只处理它知道如何处理的错误,而不是所有错误,如果不知道如何处理,可以将 error 传递给外部的 try...catch

try...catch...finally

finally 代码块在所有情况下都会被执行。

try 块中声明的变量只在 try 块中可见。

全局 catch

js 复制代码
window.onerror = function (message, url, line, col, error) {}

也可以使用提供 error 日志的 web 服务,它们会注册该服务并将一段 JS 代码插入到页面中,该代码设置了自定义的 window.onerror 函数,发生 error 时会发送一个 error 相关的网络请求到服务提供方,登录服务方的 Web 页面即可查看。

自定义 error

通过继承 Error 类来创建自定义 error,可以添加自定义属性。

js 复制代码
class MyError extends Error {
    constructor(message) {
        super(message)
        this.name = this.constructor.name
    }
}

class ValidationError extends MyError {}

class PropertyRequiredError extends ValidationError {
    constructor(property) {
        super('No property: ' + property)
        this.property = property
    }
}

使用 instanceof 来检查特定的 error,但对于来自第三方库的那些没法简单获取类的 error 对象,可以使用 name 属性用于这一类的检查。

相关推荐
elangyipi1234 分钟前
深入理解前端项目中的 package.json 和 package-lock.json
前端·json
LYFlied17 分钟前
【算法解题模板】-【回溯】----“试错式”问题解决利器
前端·数据结构·算法·leetcode·面试·职场和发展
composurext17 分钟前
录音切片上传
前端·javascript·css
程序员小寒18 分钟前
前端高频面试题:深拷贝和浅拷贝的区别?
前端·javascript·面试
狮子座的男孩23 分钟前
html+css基础:07、css2的复合选择器_伪类选择器(概念、动态伪类、结构伪类(核心)、否定伪类、UI伪类、目标伪类、语言伪类)及伪元素选择器
前端·css·经验分享·html·伪类选择器·伪元素选择器·结构伪类
zhougl99624 分钟前
Vue 中的 `render` 函数
前端·javascript·vue.js
听风吟丶25 分钟前
Spring Boot 自动配置深度解析:原理、实战与源码追踪
前端·bootstrap·html
跟着珅聪学java26 分钟前
HTML中设置<select>下拉框默认值的详细教程
开发语言·前端·javascript
IT_陈寒26 分钟前
JavaScript 性能优化:5个被低估的V8引擎技巧让你的代码提速50%
前端·人工智能·后端
想睡好32 分钟前
setup
前端·javascript·html