究竟 javascript 錯誤處理有哪些類型?

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

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


javascript規(guī)范中總共有8中錯誤類型構(gòu)造函數(shù)

1、Error -- 錯誤對象

2、SyntaxError --解析過程語法錯誤

3、TypeError -- 不屬于有效類型

4、ReferenceError -- 無效引用

5、RangeError -- 數(shù)值超出有效范圍

6、URIError -- 解析URI編碼出錯

EvalError -- 調(diào)用eval函數(shù)錯誤

7、InternalError -- Javascript引擎內(nèi)部錯誤的異常拋出, "遞歸太多"

其中兩種做個特殊說明:

EvalError調(diào)用eval函數(shù)錯誤,已經(jīng)棄用,為了向后兼容,低版本還可以使用。

InternalError?遞歸過深 拋出錯誤,多數(shù)瀏覽器未實現(xiàn),屬于非標準方法,生產(chǎn)環(huán)境禁用

Error是錯誤的基類,其他類型都繼承Error這個類,可以使用ES6中提供的Object.getPrototypeOf()來判斷,一個類是否繼承了另一個類。


來聊一聊每一種錯誤類型的使用和出錯的場景。

Error

通過Error的構(gòu)造器可以創(chuàng)建一個錯誤對象。當運行時錯誤產(chǎn)生時,Error的實例對象會被拋出。

語法:new Error([message])

參數(shù):message 可選,錯誤描述信息。


拋出錯誤

使用throw語句來拋出異常

throw?new?Error('這里拋出的是錯誤信息')

運行后,會在控制臺打印輸出:

Uncaught Error: 這里拋出的是錯誤信息

注意: 使用 throw 拋出異常后,之后的代碼不再執(zhí)行。


捕獲錯誤

可以通過try{}catch(){}語句來捕獲到這個錯誤

try{ ? ?throw new Error('這里拋出的是錯誤信息')

}catch(err){

? ?alert(err.name + ' '+ err.message)

}

屬性說明:

? ? ?當使用new Error創(chuàng)建錯誤實例后,會有兩個屬性:

let?e =?new?Error('這里拋出的是錯誤信息');

name屬性,為錯誤的類型,此時為Error

message屬性,為錯誤的信息,此時為'這里拋出的是錯誤信息'


SyntaxError

解析過程語法錯誤,這種類型拋出的錯誤有很多,往往是書寫時候造成的語法錯誤,例如:

let n = 1\1; ? // Uncaught SyntaxError: Invalid or unexpected token

let str = "hel"lo" // Uncaught SyntaxError: Unexpected identifier

let 123Var = 'hi' // Uncaught SyntaxError: Invalid or unexpected token

語法錯誤有很多就不一一列舉了,當在瀏覽器運行時,控制臺會拋錯,并且告知第幾行,所以調(diào)試器來比較方便。但要讀懂錯誤的類型為SyntaxError,以及后面的錯誤信息,這樣方便改錯。


TypeError

不屬于有效類型。這種錯誤就是在給的不是需要的類型而導致無法操作,會拋出類型錯誤。

變量或參數(shù)不是預期類型

例如**new**運算符后必須是函數(shù),而給定的不是函數(shù),則會拋出類型錯誤?

let fn = 'hello';

new fn;

拋出錯誤:

Uncaught TypeError: fn is not a constructor

調(diào)用對象不存在的方法

let obj = {};

obj.fn()

拋出錯誤:

Uncaught TypeError: obj.fn is not a function

當然你也可以在封裝函數(shù)時候,強制傳入的參數(shù)為指定類型,否則拋出類型錯誤。

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

? ?} ? ?

}

flatten('test');

傳入的參數(shù)不為數(shù)組時,拋出自定義的類型錯誤:

Uncaught?TypeError:?傳入?yún)?shù)不是數(shù)組


ReferenceError

無效引用。

????????引用了一個不存在的變量

console.log(a);

拋出錯誤

Uncaught ReferenceError: a is not defined

將變量賦值給一個無法被賦值的數(shù)據(jù)

這個錯誤常常犯的地方實在調(diào)用一個方法后在if語句中做判斷,將比較運算符==寫成了賦值運算符=,例如判斷一個字符串第一個字符是不是指定的字符:

let str = 'hello';if( str.charAt(0) = 'h' ){

console.log('第一個字符為h');

}

拋出錯誤:

Uncaught ReferenceError: Invalid left-hand side in assignment


RangeError

數(shù)值超出有效范圍。在一些方法中,傳入的數(shù)值必須在一定的范圍內(nèi),否則會拋出超出范圍的錯誤。

創(chuàng)建數(shù)組傳入的長度小于了0

let?arr =?new?Array(-1)

拋出錯誤:

Uncaught RangeError: Invalid array length

repeat方法重復指定的字符串重復次數(shù)小于0

let str = 'hello';

str.repeat(-1)

拋出錯誤:

Uncaught RangeError: Invalid count value


URIError

處理URI編碼出錯。函數(shù)參數(shù)不正確,主要是encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()這六個函數(shù)。

例如:

decodeURIComponent('%');

decodeURI('%2')

拋出錯誤:

Uncaught URIError: URI malformed


自定義錯誤類型

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

function MyErrorType(message){

? ? this.message = message || '錯誤';

? ? this.name = 'MyErrorType';

? ? this.stack = (new Error()).stack; ?// 錯誤位置和調(diào)用棧

}

MyErrorType.prototype = Object.create(Error.prototype);

MyErrorType.prototype.constructor = MyErrorType;

throw new MyErrorType('自定義錯誤類型拋出錯誤')


關(guān)于調(diào)用的錯誤棧信息

提供的錯誤的跟蹤功能,以什么樣的調(diào)用順序,在哪個文件的哪一行捕獲到這個錯誤。

例如以下調(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');

錯誤信息為:

Error: myError

at trace (:3:14)

at b (:10:6)

at a (:13:6)

at :15:4

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 第2章 基本語法 2.1 概述 基本句法和變量 語句 JavaScript程序的執(zhí)行單位為行(line),也就是一...
    悟名先生閱讀 4,549評論 0 13
  • ??由于 JavaScript 本身是動態(tài)語言,而且多年來一直沒有固定的開發(fā)工具,因此人們普遍認為它是一種最難于調(diào)...
    霜天曉閱讀 824評論 0 1
  • 0. 寫在前面 當你開始工作時,你不是在給你自己寫代碼,而是為后來人寫代碼。 —— Nichloas C. Zak...
    康斌閱讀 5,521評論 1 42
  • Error 實例對象 JavaScript 解析或運行時,一旦發(fā)生錯誤,引擎就會拋出一個錯誤對象。JavaScri...
    許先生__閱讀 304評論 0 1
  • 1.壓縮圖片android:scaleType="fitXY" 2.鎖定長寬比例縮放android:adjustV...
    Pomelo的筆記本閱讀 225評論 0 0

友情鏈接更多精彩內(nèi)容