关于JavaScript中的错误（error）

啊巴啊巴
227 阅读3分钟

今天在写代码的时候看到控制台的报错信息，突然想知道不同的错误有什么分别，于是上网查找了资料以及视频学习，对此做一个简单的总结。

一、前言

我们在开发过程中经常会看到控制台的报错信息，但是有没有深入想过，为什么报的是这样的错误呢。

每种错误都会有对应的错误类型，而当错误发生时，就会抛出相应类型的错误对象。

二、错误类型

js里面定义了以下几种类型。

1、Error ：通用类型，也是所有错误的父类型，也就是说其他错误类型都继承自该类型。

2、EvalError：表示与全局函数eval()有关的错误，这个异常不再会被JavaScript抛出，但是EvalError对象仍然保持兼容性。

3、RangeError：表示数值变量或参数超出其有效范围。试图传递一个number参数给一个范围内不包含该number的函数时则会引发RangeError。

这是一个常见的错误类型，比如我们我们一直重复调用自身的函数，导致超出调用栈的大小，便会抛出错误。

function fn() {
  fn()
}
fn() //一直在嵌套调用函数，所以抛出超过了最大调用堆栈大小

在控制台的报错信息中，可以看到

image.png

又或者我们在定义数组时，指定了数组不支持的项数，就会触发这种错误。

var arr1 = new Array(-20) // 抛出RangeError错误
var arr2 = new Array(Number.MAX_VALUE) // 抛出RangeError错误

4、ReferenceError：表示无效引用。比如引用一个不存在的变量。

这也是一个常见的错误类型，当我们访问不存在的变量时就会出发这种错误。

console.log(a) //在没有定义这个变量的情况下访问它，抛出ReferenceError

image.png

5、SyntaxError：表示eval()在解析代码的过程中发生的语法错误。

eval("a++b")

image.png

6、TypeError：表示值的类型非预期类型时发生的错误。比如当数据类型不正确时抛出错误。

这个错误在开发时经常会看到，也就是变量的类型不符合要求所致。

let b = null
console.log(b.name)

image.png

7、 URIError：表示给 encodeURI()或 decodeURl()传递的参数无效。

这种错误比较少见，因为这两个函数的容错性非常的高。对于这两个函数具体可以查看我的另一篇文章encodeURI()和encodeURIComponent()的区别

8、 AggregateError:：表示当多个错误​​需要包装在一个错误中时，该对象表示一个错误。

这是一个还没有正式使用的功能，所以在这里也不多做解释。

9、InternalError：表示出现在JavaScript引擎内部的错误。 

例如： "InternalError: too much recursion"（内部错误：递归过深）

这个类型也是非标准的，实际开发中尽量不使用它，所以也就不详细谈了。

三、错误处理与捕获

我们在学习了这么多错误类型之后，也要知道如何处理这些错误。

ECMA-262第三版引入了try-catch语句，作为JavaScript中处理异常的一种标准方式。基本的语法如下：

try {
    // 可能会导致错误的代码
} catch (error) {
    // 捕获错误，在错误发生时怎么处理
}

另外，还有跟try-catch语句相配的throw操作符，用于随时抛出自定义错误。

  function odd() {
    if (Date.now() % 2 === 1) {
        console.log('当前时间为奇数，可以执行任务')
    } else { //抛出异常
       throw new Error("当前时间为偶数，不能执行！")
  }

在上面这段代码中，如果当时间不是奇数的时候，就会抛出错误，错误信息为我们自定义的信息。

我们除了以上的几种错误类型，还可以利用原型链，通过继承Error来创建自定义错误类型。

另外，如果需要了解于Error实例的内部属性和方法,可以参考MDN文档。

avatar
文章
阅读
粉丝