错误处理机制

    上面代码中，我们调用Error构造函数，生成一个实例对象err。Error构造函数接受一个参数，表示错误提示，可以从实例的message属性读到这个参数。抛出Error实例对象以后，整个程序就中断在发生错误的地方，不再往下执行。

    JavaScript 语言标准只提到，Error实例对象必须有message属性，表示出错时的提示信息，没有提到其他属性。大多数 JavaScript 引擎，对Error实例还提供name和stack属性，分别表示错误的名称和错误的堆栈，但它们是非标准的，不是每种实现都有。

    • message：错误提示信息
    • name：错误名称（非标准属性）
    • stack：错误的堆栈（非标准属性）

    使用name和message这两个属性，可以对发生什么错误有一个大概的了解。

    1. if (error.name) {
    2.   console.log(error.name + ': ' + error.message);
    3. }

    stack属性用来查看错误发生时的堆栈。

    1. function throwit() {
    2.   throw new Error('');
    3. }
    5. function catchit() {
    6.   try {
    7.     throwit();
    8.   } catch(e) {
    9.     console.log(e.stack); // print stack trace
    10.   }
    11. }
    13. catchit()
    14. // Error
    15. //    at throwit (~/examples/throwcatch.js:9:11)
    16. //    at catchit (~/examples/throwcatch.js:3:9)
    17. //    at repl:1:5

    上面代码中，错误堆栈的最内层是throwit函数，然后是catchit函数，最后是函数的运行环境。

    原生错误类型

    Error实例对象是最一般的错误类型，在它的基础上，JavaScript 还定义了其他6种错误对象。也就是说，存在Error的6个派生对象。

    SyntaxError对象是解析代码时发生的语法错误。

    1. // 变量名错误
    2. var 1a;
    3. // Uncaught SyntaxError: Invalid or unexpected token
    5. // 缺少括号
    6. console.log 'hello');
    7. // Uncaught SyntaxError: Unexpected string

    上面代码的错误，都是在语法解析阶段就可以发现，所以会抛出SyntaxError。第一个错误提示是“token 非法”，第二个错误提示是“字符串不符合要求”。

    ReferenceError 对象

    ReferenceError对象是引用一个不存在的变量时发生的错误。

    1. // 使用一个不存在的变量
    2. unknownVariable
    3. // Uncaught ReferenceError: unknownVariable is not defined

    另一种触发场景是，将一个值分配给无法分配的对象，比如对函数的运行结果赋值。

    1. // 等号左侧不是变量
    2. console.log() = 1
    3. // Uncaught ReferenceError: Invalid left-hand side in assignment

    上面代码对函数console.log的运行结果赋值，结果引发了ReferenceError错误。

    RangeError对象是一个值超出有效范围时发生的错误。主要有几种情况，一是数组长度为负数，二是Number对象的方法参数超出范围，以及函数堆栈超过最大值。

    1. // 数组长度不得为负数
    2. new Array(-1)
    3. // Uncaught RangeError: Invalid array length

    TypeError 对象

    TypeError对象是变量或参数不是预期类型时发生的错误。比如，对字符串、布尔值、数值等原始类型的值使用new命令，就会抛出这种错误，因为new命令的参数应该是一个构造函数。

    1. new 123
    2. // Uncaught TypeError: number is not a func
    4. var obj = {};
    5. obj.unknownMethod()
    6. // Uncaught TypeError: obj.unknownMethod is not a function

    上面代码的第二种情况，调用对象不存在的方法，也会抛出TypeError错误，因为obj.unknownMethod的值是undefined，而不是一个函数。

    URIError对象是 URI 相关函数的参数不正确时抛出的错误，主要涉及encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。

    1. decodeURI('%2')
    2. // URIError: URI malformed

    EvalError 对象

    以上这6种派生错误，连同原始的Error对象，都是构造函数。开发者可以使用它们，手动生成错误对象的实例。这些构造函数都接受一个参数，代表错误提示信息（message）。

    除了 JavaScript 原生提供的七种错误对象，还可以定义自己的错误对象。

    1. function UserError(message) {
    2.   this.message = message || '默认信息';
    3.   this.name = 'UserError';
    4. }
    6. UserError.prototype = new Error();
    7. UserError.prototype.constructor = UserError;

    上面代码自定义一个错误对象UserError，让它继承Error对象。然后，就可以生成这种自定义类型的错误了。

    1. new UserError('这是自定义的错误！');

    throw 语句

    throw语句的作用是手动中断程序执行，抛出一个错误。

    1. if (x <= 0) {
    2.   throw new Error('x 必须为正数');
    3. }
    4. // Uncaught ReferenceError: x is not defined

    上面代码中，如果变量x小于等于0，就手动抛出一个错误，告诉用户x的值不正确，整个程序就会在这里中断执行。可以看到，throw抛出的错误就是它的参数，这里是一个Error实例。

    throw也可以抛出自定义错误。

    1. function UserError(message) {
    2.   this.message = message || '默认信息';
    3.   this.name = 'UserError';
    4. }
    6. // Uncaught UserError {message: "出错了！", name: "UserError"}

    上面代码中，throw抛出的是一个UserError实例。

    实际上，throw可以抛出任何类型的值。也就是说，它的参数可以是任何值。

    1. // 抛出一个字符串
    2. throw 'Error！';
    3. // Uncaught Error！
    5. // 抛出一个数值
    6. throw 42;
    7. // Uncaught 42
    9. // 抛出一个布尔值
    10. throw true;
    11. // Uncaught true
    13. // 抛出一个对象
    14. throw {
    15.   toString: function () {
    16.     return 'Error!';
    17.   }
    18. };
    19. // Uncaught {toString: ƒ}

    对于 JavaScript 引擎来说，遇到throw语句，程序就中止了。引擎会接收到throw抛出的信息，可能是一个错误实例，也可能是其他类型的值。

    一旦发生错误，程序就中止执行了。JavaScript 提供了try...catch结构，允许对错误进行处理，选择是否往下执行。

    1. try {
    2.   throw new Error('出错了!');
    3. } catch (e) {
    4.   console.log(e.name + ": " + e.message);
    5.   console.log(e.stack);
    6. }
    7. // Error: 出错了!
    8. //   at <anonymous>:3:9
    9. //   ...

    上面代码中，try代码块抛出错误（上例用的是throw语句），JavaScript 引擎就立即把代码的执行，转到catch代码块，或者说错误被catch代码块捕获了。catch接受一个参数，表示try代码块抛出的值。

    如果你不确定某些代码是否会报错，就可以把它们放在try...catch代码块之中，便于进一步对错误进行处理。

    1. try {
    2.   f();
    3. } catch(e) {
    4.   // 处理错误
    5. }

    上面代码中，如果函数f执行报错，就会进行catch代码块，接着对错误进行处理。

    catch代码块捕获错误之后，程序不会中断，会按照正常流程继续执行下去。

    1. try {
    2.   throw "出错了";
    3. } catch (e) {
    4.   console.log(111);
    5. }
    6. console.log(222);
    7. // 111
    8. // 222

    上面代码中，try代码块抛出的错误，被catch代码块捕获后，程序会继续向下执行。

    上面代码中，catch代码之中又抛出了一个错误。

    为了捕捉不同类型的错误，catch代码块之中可以加入判断语句。

    1. try {
    2.   foo.bar();
    3. } catch (e) {
    4.   if (e instanceof EvalError) {
    5.     console.log(e.name + ": " + e.message);
    6.   } else if (e instanceof RangeError) {
    7.     console.log(e.name + ": " + e.message);
    8.   }
    9.   // ...
    10. }

    上面代码中，catch捕获错误之后，会判断错误类型（EvalError还是RangeError），进行不同的处理。

    finally 代码块

    try...catch结构允许在最后添加一个finally代码块，表示不管是否出现错误，都必需在最后运行的语句。

    1. function cleansUp() {
    2.   try {
    3.     throw new Error('出错了……');
    4.     console.log('此行不会执行');
    5.   } finally {
    6.     console.log('完成清理工作');
    7.   }
    8. }
    10. cleansUp()
    11. // 完成清理工作
    12. // Uncaught Error: 出错了……
    13. //    at cleansUp (<anonymous>:3:11)
    14. //    at <anonymous>:10:1

    上面代码中，由于没有catch语句块，一旦发生错误，代码就会中断执行。中断执行之前，会先执行finally代码块，然后再向用户提示报错信息。

    1. function idle(x) {
    2.   try {
    3.     console.log(x);
    4.     return 'result';
    5.   } finally {
    6.     console.log('FINALLY');
    7.   }
    8. }
    10. idle('hello')
    11. // hello
    12. // FINALLY

    上面代码中，try代码块没有发生错误，而且里面还包括语句，但是finally代码块依然会执行。而且，这个函数的返回值还是result。

    下面的例子说明，return语句的执行是排在finally代码之前，只是等finally代码执行完毕后才返回。

    1. function countUp() {
    2.   try {
    3.     return count;
    4.   } finally {
    5.     count++;
    6.   }
    7. }
    9. countUp()
    10. // 0
    11. count
    12. // 1

    上面代码说明，return语句里面的count的值，是在finally代码块运行之前就获取了。

    下面是finally代码块用法的典型场景。

    1. openFile();
    3. try {
    4.   writeFile(Data);
    5. } catch(e) {
    6.   handleError(e);
    7. } finally {
    8.   closeFile();
    9. }

    上面代码首先打开一个文件，然后在try代码块中写入文件，如果没有发生错误，则运行finally代码块关闭文件；一旦发生错误，则先使用catch代码块处理错误，再使用finally代码块关闭文件。

    下面的例子充分反映了try...catch...finally这三者之间的执行顺序。

    1. function f() {
    2.   try {
    3.     console.log(0);
    4.     throw 'bug';
    5.   } catch(e) {
    6.     console.log(1);
    7.     return true; // 这句原本会延迟到 finally 代码块结束再执行
    8.     console.log(2); // 不会运行
    9.   } finally {
    10.     console.log(3);
    11.     return false; // 这句会覆盖掉前面那句 return
    12.     console.log(4); // 不会运行
    13.   }
    15.   console.log(5); // 不会运行
    16. }
    18. var result = f();
    19. // 0
    20. // 1
    21. // 3
    23. result
    24. // false

    上面代码中，catch代码块结束执行之前，会先执行finally代码块。

    catch代码块之中，触发转入finally代码块的标志，不仅有return语句，还有throw语句。

    1. function f() {
    2.   try {
    3.     throw '出错了！';
    4.   } catch(e) {
    5.     console.log('捕捉到内部错误');
    6.     throw e; // 这句原本会等到finally结束再执行
    7.   } finally {
    8.     return false; // 直接返回
    9.   }
    10. }
    12. try {
    13.   f();
    14. } catch(e) {
    15.   // 此处不会执行
    16.   console.log('caught outer "bogus"');
    17. }
    19. //  捕捉到内部错误

    上面代码中，进入catch代码块之后，一遇到throw语句，就会去执行finally代码块，其中有return false语句，因此就直接返回了，不再会回去执行catch代码块剩下的部分了。

    try代码块内部，还可以再使用try代码块。

    1. try {
    2.   try {
    3.     consle.log('Hello world!'); // 报错
    4.   }
    5.   finally {
    6.     console.log('Finally');
    7.   }
    8.   console.log('Will I run?');
    9. } catch(error) {
    10.   console.error(error.message);
    11. }
    12. // Finally
    13. // consle is not defined
    • Jani Hartikainen,