JavaScript错误处理机制详解：Error类型、throw与try-catch用法

1. Error 实例

当JavaScript运行过程中发生错误时，会抛出相应的错误对象。JS语言内置了Error构造函数，所有被抛出的错误本质上都是该构造函数的实例。

const err = new Error('代码出错了');
err.message; // 代码出错了

上述Error构造函数除了接受一个message参数外，还包含另外两个重要参数：name和stack。

message：用于显示错误的提示信息。
name：标识错误的名称。
stack：记录错误的调用栈信息，便于定位问题。

const err = new Error('代码出错了');
err.name; // 'Error'
err.stack; //'Error: 出错了\n    at <anonymous>:1:5'

2. 原生错误类型

除了基础的Error类型外，JavaScript还内置了六种特定的原始错误类型，用于区分不同性质的运行时错误。

ReferenceError：引用错误。
SyntaxError：语法错误。
TypeError：类型错误。
RangeError：范围错误。
URIError：URI方法执行错误。
EvalError：eval函数执行错误。

2.1 ReferenceError

当代码尝试访问一个不存在的变量时，会抛出ReferenceError。

test; 
//Uncaught ReferenceError: assd is not defined at <anonymous>:1:1

另一种触发场景是将值赋值给无法被赋值的对象，例如尝试对函数的执行结果进行赋值操作。

console.log() = 1
// Uncaught ReferenceError: Invalid left-hand side in assignment

2.2 SyntaxError

当JavaScript引擎在解析代码时发现语法错误，会抛出SyntaxError。

const 1a;
Uncaught SyntaxError: Invalid or unexpected token
5 = 6;
Uncaught SyntaxError: Invalid left-hand side in assignment

2.3 TypeError

当变量或参数的类型不符合预期时，会出现TypeError。例如，对非函数类型使用new关键字，或对非函数类型使用圆括号进行调用运算。

let a; 
a(); 
//VM7449:1 Uncaught TypeError: b is not a function at <anonymous>:1:1

2.4 RangeError

当数值超出预期范围时，会触发RangeError。主要情况包括：数组长度为负数、Number对象的方法接收的参数超出允许范围，以及函数递归调用导致堆栈溢出（超出最大值）。

const arr = new Array(-5);
//VM7833:1 Uncaught RangeError: Invalid array lengthat <anonymous>:1:13
function foo(){
  foo();
};
foo();
//Uncaught RangeError: Maximum call stack size exceeded

2.5 URIError

当URI相关方法执行出错时，会出现URIError，例如接收了非预期的参数导致编码解析失败。

decodeURI('%');
//VM8142:1 Uncaught URIError: URI malformedat decodeURI (<anonymous>)at <anonymous>:1:1

2.6 evalError

当eval函数执行出错时会抛出EvalError。该错误类型目前已不再使用，保留它是为了兼容旧代码。

3. 自定义错误类型

除了JS提供的7种原生错误类型外，开发者还可以通过继承Error来创建自定义的错误类型，以便更精确地描述业务逻辑中的异常。

funtion CustomError(message){
  this.message = message;
  this.name = 'CustomError';
};
CustomError.prototype = new Error();
CustomError.prototype.construct = CustomError;
throw new CustomError('这是一个自定义错误');
//CustomError {message: '这是一个自定义错误', name: 'CustomError'};

4. throw

在使用throw抛出错误时，代码执行会在throw语句处立即终止，throw之后的代码将不再执行。

throw new Error('出错了');
console.log('该行代码不会执行');

实际上，throw不仅能抛出Error实例，还能抛出任意类型的数据。对于JavaScript引擎而言，只要遇到throw语句，代码执行就会停止。

thorw '23';
console.log('该行代码不会执行');
throw true;
throw {};
throw [];
throw 20;

throw语句有两种写法：可以加上圆括号，也可以省略圆括号。

throw new Error('出错了');
throw (new Error('出错了'));

5. try…catch

直接使用throw会阻碍后续代码的执行。使用try…catch包裹throw语句可以避免影响后续代码的运行，其中catch用于捕获错误，当代码发生错误时执行catch块中的逻辑。

    try {
      throw new Error('出错了');
    } catch (e) {
      console.error(e)
    };
    console.log('后续代码继续执行'); //后续代码继续执行

6. finally

无论是否发生错误，finally语句块中的代码都会执行。

    try {
      throw new Error('出错了');
    } catch (e) {
      console.log('catch')
    }finally{
       console.log('finally');
    }

总结

JS内置了六种内错误类型: SyntaxError、ReferenceError、TypeError、RangeError、URIError、EvalError

到此这篇关于JavaScript错误处理机制全面分析讲解的文章就介绍到这了,更多相关JS错误处理机制内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！

JavaScript错误处理机制全面解析：从Error实例到自定义异常