1. Error 實(shí)例

JavaScript在運(yùn)行錯(cuò)誤時(shí)會(huì)拋出一個(gè)錯(cuò)誤,JS提供了Error構(gòu)造函數(shù),所有拋出的錯(cuò)誤都是這個(gè)構(gòu)造函數(shù)的實(shí)例

const err = new Error('代碼出錯(cuò)了');
err.message; // 代碼出錯(cuò)了

上面的Error接受了一個(gè)message參數(shù),Error構(gòu)造函數(shù)還有另外兩個(gè)參數(shù)name和stack

• message 錯(cuò)誤提示信息
• name 錯(cuò)誤名稱
• stack 錯(cuò)誤的調(diào)用棧

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

2. 原生錯(cuò)誤類型

除了基礎(chǔ)的Error錯(cuò)誤類型,JavaScript還內(nèi)置了六種原始的錯(cuò)誤類型

• ReferenceError 引用錯(cuò)誤
• SyntaxError 語法錯(cuò)誤
• TypeError 類型錯(cuò)誤
• RangeError 范圍錯(cuò)誤
• URIError URI方法執(zhí)行錯(cuò)誤
• EvalError eval函數(shù)執(zhí)行錯(cuò)誤

2.1 ReferenceError

使用一個(gè)不存在的變量時(shí)會(huì)拋出Reference Error

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

另一種觸發(fā)的場景是將一個(gè)值分配給無法分配的對(duì)象,比如對(duì)函數(shù)的運(yùn)行結(jié)果賦值

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

2.2 SyntaxError

當(dāng)JS解析代碼發(fā)生錯(cuò)誤時(shí)會(huì)拋出SyntaxError錯(cuò)誤

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

2.3 TypeError

放變量或者參數(shù)不是預(yù)期類型的時(shí)候會(huì)出現(xiàn)TypeError錯(cuò)誤,比如對(duì)非函數(shù)類型使用new,或者對(duì)非函數(shù)類型使用圓括號(hào)運(yùn)算

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

2.4 RangeError

當(dāng)數(shù)值超出預(yù)期范圍的時(shí)候會(huì)出現(xiàn)RangeError,主要情況有幾種,一是數(shù)組長度為負(fù)數(shù),二是Number對(duì)象的方法接收的參數(shù)超出范圍,以及函數(shù)堆棧超出最大值

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方法執(zhí)行錯(cuò)誤時(shí)會(huì)出現(xiàn)URIError錯(cuò)誤,例如URIError接收非預(yù)期的參數(shù)

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

2.6 evalError

eval函數(shù)執(zhí)行錯(cuò)誤時(shí)會(huì)拋出EvalError,該錯(cuò)誤類型以及不再被使用了,知識(shí)為了保證與以前代碼兼容才保留

3. 自定義錯(cuò)誤類型

除了JS提供的7種原生的錯(cuò)誤類型,還可以通過繼承Error自定義錯(cuò)誤類型

funtion CustomError(message){
  this.message = message;
  this.name = 'CustomError';
};
CustomError.prototype = new Error();
CustomError.prototype.construct = CustomError;
throw new CustomError('這是一個(gè)自定義錯(cuò)誤');
//CustomError {message: '這是一個(gè)自定義錯(cuò)誤', name: 'CustomError'};

4. throw

在使用thorw拋出錯(cuò)誤的時(shí)候,代碼執(zhí)行會(huì)在在throw處終止,thorw以下的代碼將不再執(zhí)行

throw new Error('出錯(cuò)了');
console.log('該行代碼不會(huì)執(zhí)行');

實(shí)際上throw不僅能拋出Error實(shí)例,還能拋出任意類型的數(shù)據(jù),對(duì)javaScript引擎來說只要遇上throw代碼就停止執(zhí)行

thorw '23';
console.log('該行代碼不會(huì)執(zhí)行');
throw true;
throw {};
throw [];
throw 20;

throw方法有兩種寫法,可以加上圓括號(hào)和省略圓括號(hào)

throw new Error('出錯(cuò)了');
throw (new Error('出錯(cuò)了'));

5. try…catch

使用throw的時(shí)候會(huì)阻礙后續(xù)代碼的執(zhí)行,使用費(fèi)try…catch包裹throw語句就不會(huì)影響后續(xù)代碼的執(zhí)行了,catch用于錯(cuò)誤的捕獲,代碼發(fā)生錯(cuò)誤的時(shí)候執(zhí)行。

    try {
      throw new Error('出錯(cuò)了');
    } catch (e) {
      console.error(e)
    };
    console.log('后續(xù)代碼繼續(xù)執(zhí)行'); //后續(xù)代碼繼續(xù)執(zhí)行

6. finally

不管是否發(fā)生錯(cuò)誤finally語句都會(huì)執(zhí)行

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

總結(jié)

JS內(nèi)置了六種內(nèi)錯(cuò)誤類型: SyntaxError、ReferenceError、TypeError、RangeError、URIError、EvalError

到此這篇關(guān)于JavaScript錯(cuò)誤處理機(jī)制全面分析講解的文章就介紹到這了,更多相關(guān)JS錯(cuò)誤處理機(jī)制內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論