JavaScript錯誤處理機制全面分析講解
1. Error 實例
JavaScript在運行錯誤時會拋出一個錯誤,JS提供瞭Error構造函數,所有拋出的錯誤都是這個構造函數的實例
const err = new Error('代碼出錯瞭'); err.message; // 代碼出錯瞭
上面的Error接受瞭一個message參數,Error構造函數還有另外兩個參數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
使用一個不存在的變量時會拋出Reference Error
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
當JS解析代碼發生錯誤時會拋出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錯誤,例如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
在使用thorw拋出錯誤的時候,代碼執行會在在throw處終止,thorw以下的代碼將不再執行
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用於錯誤的捕獲,代碼發生錯誤的時候執行。
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錯誤處理機制內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet!
推薦閱讀:
- 簡單聊聊Js中的常見錯誤類型
- JS中的Error對象及使用JSON.stringify()序列化Error問題
- JavaScript高級之自定義異常
- 詳解JavaScript錯誤捕獲
- JavaScript錯誤處理try..catch…finally+涵蓋throw+TypeError+RangeError