JavaScript学习笔记14-错误处理方案

throw关键字,Error,异常的处理及捕获try/catch/finally

1. 错误处理方案

  • 开发中会封装一些工具函数,封装之后给别人使用

    • 在其他人使用的过程中,可能会传递一些参数
    • 对于函数来说,需要对这些参数进行验证,否则可能得到的是不想要的结果
  • 很多时候可能验证到不是希望得到的参数时,就会直接return

    • 但是return存在很大的弊端:调用者不知道是因为函数内部没有正常执行,还是执行结果就是一个undefined

    • 事实上,正确的做法应该是如果没有通过某些验证,那么应该让外界知道函数内部报错了

  • 如何可以让一个函数告知外界自己内部出现了错误呢?

    • 通过throw关键字,抛出一个异常
  • throw语句

    • throw语句用于抛出一个用户自定义的异常
    • 当遇到throw语句时,当前的函数执行会被停止(throw后面的语句不会执行);
  • 如果执行代码,就会报错,拿到错误信息的时候可以及时修正代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function sum(a,b){
if(typeof a !== "number" || typeof b !== "number"){
throw "parameters is error type"
}
return a+b;
}

/**
/throw.js:3
throw "parameters is error type"
^
parameters is error type
(Use `node --trace-uncaught ...` to show where the exception was thrown)
*/
console.log(sum({uname:"why"},18));
// throw后面的语句不会执行
console.log("后续代码继续执行");

2. throw关键字

  • throw表达式就是在throw后面可以跟上一个表达式来表示具体的异常信息 throw expression;

  • throw关键字可以跟上哪些类型呢?

    • 基本数据类型:比如number、string、Boolean

      1
      2
      3
      throw 100;
      throw "error message";
      throw false;
    • 对象类型:对象类型可以包含更多的信息

      1
      2
      3
      4
      throw {
      errorCode: -1001,
      message: "错误信息"
      }
  • 也可以创建一个类

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    class MyError{
    constructor(errorCode, errorMessage){
    this.errorCode = errorCode;
    this.errorMessage = errorMessage;
    }
    }

    function sum(a,b){
    if(typeof a !== "number" || typeof b !== "number"){
    throw new MyError(-1001,"parameters is error type");
    }
    return a+b;
    }

    /**
    /throw.js:10
    throw new MyError(-1001,"parameters is error type");
    ^
    MyError { errorCode: -1001, errorMessage: 'parameters is error type' }
    */
    console.log(sum({uname:"why"},18));

    console.log("后续代码继续执行");

3. Error类型

  • JavaScript提供了一个Error类,可以直接创建类对象

    1
    2
    3
    function foo(){
    throw new Error("error message");
    }
  • Error包含三个属性

    • messsage:创建Error对象时传入的message
    • name:Error的名称,通常和类的名称一致
    • stack:整个Error的错误信息,包括函数的调用栈,直接打印Error对象时,打印的就是stack
  • Error有一些自己的子类

    • RangeError:下标值越界时使用的错误类型
    • SyntaxError:解析语法错误时使用的错误类型
    • TypeError:出现类型错误时使用的错误类型

4. 异常的处理

  • 一个函数抛出了异常,调用它的时候程序会被强制终止

    • 这是因为在调用一个函数时,这个函数抛出了异常,但是并没有对这个异常进行处理,那么这个异常会继续传递到上一个函数调用中
    • 而如果到了最顶层(全局)的代码中依然没有对这个异常的处理代码,这个时候就会报错并且终止程序的运行
  • 异常传递过程

    • foo函数在被执行时会抛出异常,也就是bar函数会拿到这个异常
    • 但是bar函数并没有对这个异常进行处理,那么这个异常就会被继续传递到调用bar函数的函数,也就是test函数
    • 但是test函数依然没有处理,就会继续传递到全局代码逻辑中
    • 依然没有被处理,这个时候程序会终止执行,后续代码都不会再执行了
1
2
3
4
5
6
7
8
9
10
11
12
function foo(){
throw "error message";
}
function bar(){
foo();
}
function test(){
bar();
}

test();
console.log("后续代码继续执行");

5. 异常的捕获

  • 但是很多情况下当出现异常时,并不希望程序直接推出,而是希望可以正确的处理异常,这个时候,可以使用try catch

    1
    2
    3
    4
    5
    6
    7
    8
    9
    try{
    try_statements
    }
    [catch(exception_var){
    catch_statements
    }]
    [finally{
    finally_statements
    }]

    修改以上代码

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    function foo(){
    throw "error message";
    }
    function bar(){
    try {
    foo();
    console.log("执行foo");
    } catch (error) {
    console.log("Error",error);
    }

    }
    function test(){
    bar();
    }

    // Error error message
    // 后续代码继续执行
    test();
    console.log("后续代码继续执行");
  • 在ES10(ES2019)中,catch后面绑定的error可以省略

  • 当然,如果有一些必须要执行的代码,可以使用finally来执行

    • finally表示最终一定会被执行的代码结构
    • 注意:如果try和finally中都有返回值,那么会使用finally当中的返回值
本文结束  感谢您的阅读