javascript錯(cuò)誤處理機(jī)制是什么

小編給大家分享一下javascript錯(cuò)誤處理機(jī)制是什么，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

有時(shí)候，在自己封裝的工具函數(shù)中，不傳參或傳入了錯(cuò)誤類(lèi)型的參數(shù)，也要適當(dāng)?shù)膾伋鲆恍╁e(cuò)誤以示警告；使用框架不正常情況下也會(huì)拋出錯(cuò)誤，如果對(duì)錯(cuò)誤一無(wú)所知，便無(wú)從下手調(diào)試。綜合上述，了解錯(cuò)誤的處理機(jī)制是多么必要。

以下是筆者歸納總結(jié)，如有誤之處，歡迎指出。

錯(cuò)誤構(gòu)造函數(shù)
javascript規(guī)范中總共有8中錯(cuò)誤類(lèi)型構(gòu)造函數(shù)
Error -- 錯(cuò)誤對(duì)象
SyntaxError --解析過(guò)程語(yǔ)法錯(cuò)誤
TypeError -- 不屬于有效類(lèi)型
ReferenceError -- 無(wú)效引用
RangeError -- 數(shù)值超出有效范圍
URIError -- 解析URI編碼出錯(cuò)
EvalError -- 調(diào)用eval函數(shù)錯(cuò)誤
InternalError -- Javascript引擎內(nèi)部錯(cuò)誤的異常拋出， "遞歸太多"

其中兩種做個(gè)特殊說(shuō)明：
EvalError調(diào)用eval函數(shù)錯(cuò)誤，已經(jīng)棄用，為了向后兼容，低版本還可以使用。
InternalError 遞歸過(guò)深 拋出錯(cuò)誤，多數(shù)瀏覽器未實(shí)現(xiàn)，屬于非標(biāo)準(zhǔn)方法，生產(chǎn)環(huán)境禁用
繼承關(guān)系
Error是錯(cuò)誤的基類(lèi)，其他類(lèi)型都繼承Error這個(gè)類(lèi)，可以使用ES6中提供的Object.getPrototypeOf()來(lái)判斷，一個(gè)類(lèi)是否繼承了另一個(gè)類(lèi)。

console.log(Object.getPrototypeOf(SyntaxError) === Error);    // true
console.log(Object.getPrototypeOf(TypeError) === Error);   // true
console.log(Object.getPrototypeOf(RangeError) === Error);   // true
console.log(Object.getPrototypeOf(URIError) ===  Error);   // true
console.log(Object.getPrototypeOf(EvalError) === Error);   // true
console.log(Object.getPrototypeOf(ReferenceError) === Error); // true

來(lái)聊一聊每一種錯(cuò)誤類(lèi)型的使用和出錯(cuò)的場(chǎng)景。

Error
通過(guò)Error的構(gòu)造器可以創(chuàng)建一個(gè)錯(cuò)誤對(duì)象。當(dāng)運(yùn)行時(shí)錯(cuò)誤產(chǎn)生時(shí)，Error的實(shí)例對(duì)象會(huì)被拋出。
語(yǔ)法：new Error([message])
參數(shù)：

message 可選，錯(cuò)誤描述信息。

拋出錯(cuò)誤
使用throw語(yǔ)句來(lái)拋出異常
throw new Error('這里拋出的是錯(cuò)誤信息')
運(yùn)行后，會(huì)在控制臺(tái)打印輸出：
Uncaught Error: 這里拋出的是錯(cuò)誤信息
注意： 使用 throw 拋出異常后，之后的代碼不再執(zhí)行。

捕獲錯(cuò)誤
可以通過(guò)try{}catch(){}語(yǔ)句來(lái)捕獲到這個(gè)錯(cuò)誤

try{
   throw new Error('這里拋出的是錯(cuò)誤信息')
 }
 catch(err){
   alert(err.name + ' '+ err.message)
   }

屬性說(shuō)明：

 當(dāng)使用new Error創(chuàng)建錯(cuò)誤實(shí)例后，會(huì)有兩個(gè)屬性：

let e = new Error('這里拋出的是錯(cuò)誤信息');
name屬性，為錯(cuò)誤的類(lèi)型，此時(shí)為Error
message屬性，為錯(cuò)誤的信息，此時(shí)為'這里拋出的是錯(cuò)誤信息'

SyntaxError
解析過(guò)程語(yǔ)法錯(cuò)誤,這種類(lèi)型拋出的錯(cuò)誤有很多，往往是書(shū)寫(xiě)時(shí)候造成的語(yǔ)法錯(cuò)誤，例如：

let n = 11;   // Uncaught SyntaxError: Invalid or unexpected token
let str = "hel"lo" // Uncaught SyntaxError: Unexpected identifier
let 123Var = 'hi' // Uncaught SyntaxError: Invalid or unexpected token

語(yǔ)法錯(cuò)誤有很多就不一一列舉了，當(dāng)在瀏覽器運(yùn)行時(shí)，控制臺(tái)會(huì)拋錯(cuò)，并且告知第幾行，所以調(diào)試器來(lái)比較方便。但要讀懂錯(cuò)誤的類(lèi)型為SyntaxError，以及后面的錯(cuò)誤信息，這樣方便改錯(cuò)。

TypeError
不屬于有效類(lèi)型。這種錯(cuò)誤就是在給的不是需要的類(lèi)型而導(dǎo)致無(wú)法操作，會(huì)拋出類(lèi)型錯(cuò)誤。
變量或參數(shù)不是預(yù)期類(lèi)型，
變量或參數(shù)不是預(yù)期類(lèi)型
例如new運(yùn)算符后必須是函數(shù)，而給定的不是函數(shù)，則會(huì)拋出類(lèi)型錯(cuò)誤

let fn = 'hello';
new fn;

拋出錯(cuò)誤：
Uncaught TypeError: fn is not a constructor
調(diào)用對(duì)象不存在的方法

let obj = {};
obj.fn()

拋出錯(cuò)誤：
Uncaught TypeError: obj.fn is not a function
當(dāng)然你也可以在封裝函數(shù)時(shí)候，強(qiáng)制傳入的參數(shù)為指定類(lèi)型，否則拋出類(lèi)型錯(cuò)誤。

function flatten(arr){
if( !Array.isArray(arr) )
{
       throw new TypeError('傳入?yún)?shù)不是數(shù)組')   
}    
}

flatten('test');

傳入的參數(shù)不為數(shù)組時(shí)，拋出自定義的類(lèi)型錯(cuò)誤：
Uncaught TypeError: 傳入?yún)?shù)不是數(shù)組

ReferenceError
無(wú)效引用。

引用了一個(gè)不存在的變量

console.log(a);

拋出錯(cuò)誤
Uncaught ReferenceError: a is not defined
將變量賦值給一個(gè)無(wú)法被賦值的數(shù)據(jù)
這個(gè)錯(cuò)誤常常犯的地方實(shí)在調(diào)用一個(gè)方法后在if語(yǔ)句中做判斷，將比較運(yùn)算符==寫(xiě)成了賦值運(yùn)算符=，例如判斷一個(gè)字符串第一個(gè)字符是不是指定的字符：

let str = 'hello';
if( str.charAt(0) = 'h' ){
   console.log('第一個(gè)字符為h');
   }

拋出錯(cuò)誤：
Uncaught ReferenceError: Invalid left-hand side in assignment
RangeError
數(shù)值超出有效范圍。在一些方法中，傳入的數(shù)值必須在一定的范圍內(nèi)，否則會(huì)拋出超出范圍的錯(cuò)誤。
創(chuàng)建數(shù)組傳入的長(zhǎng)度小于了0

let arr = new Array(-1)

拋出錯(cuò)誤：
Uncaught RangeError: Invalid array length
repeat方法重復(fù)指定的字符串重復(fù)次數(shù)小于0

let str = 'hello';
str.repeat(-1)

拋出錯(cuò)誤：
Uncaught RangeError: Invalid count value

URIError
處理URI編碼出錯(cuò)。函數(shù)參數(shù)不正確，主要是encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()這六個(gè)函數(shù)。
例如：

decodeURIComponent('%');
decodeURI('%2')

拋出錯(cuò)誤：
Uncaught URIError: URI malformed

自定義錯(cuò)誤類(lèi)型
有時(shí)候希望自定義錯(cuò)誤類(lèi)型，需要自定義一個(gè)構(gòu)造函數(shù)，然后讓原型繼承繼承Error.prototype即可。

function MyErrorType(message){
this.message = message || '錯(cuò)誤';
this.name = 'MyErrorType';
this.stack = (new Error()).stack;  // 錯(cuò)誤位置和調(diào)用棧
}
MyErrorType.prototype = Object.create(Error.prototype);
MyErrorType.prototype.constructor = MyErrorType;
throw new MyErrorType('自定義錯(cuò)誤類(lèi)型拋出錯(cuò)誤')

關(guān)于調(diào)用的錯(cuò)誤棧信息
提供的錯(cuò)誤的跟蹤功能，以什么樣的調(diào)用順序，在哪個(gè)文件的哪一行捕獲到這個(gè)錯(cuò)誤。
例如以下調(diào)用：

 function trace() {
  try {
        throw new Error('myError');
  }
  catch(e) {
        console.log(e.stack);
  }
  }
function b() {
trace();
}
function a() {
b(3, 4, '\n\n', undefined, {});
}
a('first call, firstarg');

錯(cuò)誤信息為：
Error: myError
  at trace (<Error.html>:3:14)
  at b (<Error.html>:10:6)
  at a (<Error.html>:13:6)
  at <Error.html>:15:4

以上是javascript錯(cuò)誤處理機(jī)制是什么的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！