ES6 - 错误处理

编程中存在三种类型的错误：语法错误、运行时错误和逻辑错误。

语法错误

语法错误，也称为解析错误，在传统的编程语言中发生在编译时，在 JavaScript 中发生在解释时。当 JavaScript 中发生语法错误时，只有包含语法错误的同一线程中的代码受到影响，其他线程中的其余代码将继续执行，假设其中没有任何内容依赖于包含错误的代码。

运行时错误

运行时错误，也称为异常，发生在执行期间（编译/解释之后）。异常也会影响其发生的线程，允许其他 JavaScript 线程继续正常执行。

逻辑错误

逻辑错误可能是最难追踪的错误类型。这些错误不是语法或运行时错误的结果。相反，当你在驱动脚本的逻辑中犯错并且没有得到预期的结果时，就会发生这些错误。

你无法捕获这些错误，因为这取决于你的业务需求，你想在程序中使用哪种类型的逻辑。

当发生运行时错误时，JavaScript 会抛出 Error 对象的实例。下表列出了 Error 对象的预定义类型。

序号	Error 对象及描述
1	EvalError 创建一个表示与全局函数eval()相关的错误发生的实例。
2	RangeError 创建一个表示数值变量或参数超出其有效范围时发生的错误的实例。
3	ReferenceError 创建一个表示解除对无效引用的引用时发生的错误的实例。
4	SyntaxError 创建一个表示在解析代码时发生的语法错误的实例。
5	TypeError 创建一个表示变量或参数类型无效时发生的错误的实例。
6	URIError 创建一个表示encodeURI()或decodeURI()传递无效参数时发生的错误的实例。

抛出异常

可以使用throw 语句引发错误（预定义或用户定义）。稍后可以捕获这些异常，并可以采取适当的操作。以下是相同语法的示例。

语法：抛出一个通用异常

throw new Error([message]) 
OR 
throw([message])

语法：抛出一个特定异常

throw new Error_name([message])

异常处理

异常处理是通过try...catch 语句完成的。当程序遇到异常时，程序将以不友好的方式终止。为了防止这种意外错误，我们可以将代码包装在 try...catch 语句中。

try 块后面必须紧跟一个 catch 块或一个 finally 块（或两者之一）。当 try 块中发生异常时，异常将放在 e 中，并执行 catch 块。可选的 finally 块在 try/catch 后无条件执行

以下是相同语法的示例。

try {  
   // Code to run  
   [break;]  
} catch ( e ) {  
   // Code to run if an exception occurs
   [break;]  
}[ finally {  
   // Code that is always executed regardless of  
   // an exception occurring  
}]

示例

var a = 100; 
var b = 0; 
try { 
   if (b == 0 ) { 
      throw(“Divide by zero error.”); 
   } else { 
      var c = a / b; 
   } 
} 
catch( e ) { 
   console.log("Error: " + e ); 
}

输出

在上述代码成功执行后，将显示以下输出。

Error: Divide by zero error

注意 - 注意：你可以在一个函数中引发异常，然后可以使用try...catch块在同一函数或调用函数中捕获该异常。

onerror( ) 方法

onerror 事件处理程序是第一个促进 JavaScript 中错误处理的功能。每当页面上发生异常时，都会在 window 对象上触发 error 事件。

示例

<html> 
   <head> 
      <script type = "text/javascript"> 
         window.onerror  =  function () {  
            document.write ("An error occurred.");  
         } 
      </script> 
   </head> 

   <body> 
      <p>Click the following to see the result:</p> 
      <form> 
         <input type = "button" value = "Click Me" onclick = "myFunc();" /> 
      </form> 
   </body> 
</html>

输出

在上述代码成功执行后，将显示以下输出。

onerror 事件处理程序提供三条信息来识别错误的确切性质 -

错误消息 - 浏览器为给定错误显示的相同消息。
URL - 发生错误的文件。
行号 - 给定 URL 中导致错误的行号。

以下示例显示了如何提取这些信息。

示例

<html> 
   <head> 
      <script type = "text/javascript"> 
         window.onerror  =  function (msg, url, line) {  
            document.write ("Message : " + msg );  
            document.write ("url : " + url );  
            document.write ("Line number : " + line );  
         } 
      </script> 
   </head> 

   <body> 
      <p>Click the following to see the result:</p> 
      <form> 
         <input type = "button" value = "Click Me" onclick = "myFunc();" /> 
      </form> 
   </body> 
</html>

自定义错误

JavaScript 支持自定义错误的概念。以下示例说明了这一点。

示例 1：带有默认消息的自定义错误

function MyError(message) { 
   this.name = 'CustomError'; 
   this.message = message || 'Error raised with default message'; 
} 
try { 
   throw new MyError(); 
} catch (e) {  
   console.log(e.name);      
   console.log(e.message);  // 'Default Message' 
}

在上述代码成功执行后，将显示以下输出。

CustomError 
Error raised with default message

示例 2：带有用户定义错误消息的自定义错误

function MyError(message) { 
   this.name = 'CustomError'; 
   this.message = message || 'Default Error Message';  
} try { 
   throw new MyError('Printing Custom Error message'); 
} 
catch (e) { 
   console.log(e.name);      
   console.log(e.message);  
}

在上述代码成功执行后，将显示以下输出。

CustomError 
Printing Custom Error message

打印页面