JavaScript中的Error錯(cuò)誤對(duì)象與自定義錯(cuò)誤類型詳解
Error
Error是JavaScript語(yǔ)言中的一個(gè)標(biāo)準(zhǔn)的內(nèi)置對(duì)象,專門用于處理JS開(kāi)發(fā)中的運(yùn)行時(shí)錯(cuò)誤。
當(dāng)我們的JS代碼在運(yùn)行過(guò)程中發(fā)生錯(cuò)誤的話,就會(huì)拋出Error對(duì)象,整個(gè)程序?qū)?huì)中斷在錯(cuò)誤發(fā)生的代碼處,不再繼續(xù)執(zhí)行,這也是錯(cuò)誤類型必須重視的原因:它會(huì)導(dǎo)致頁(yè)面無(wú)法顯示或者功能失效。
Error是JavaScript中最原始的錯(cuò)誤對(duì)象,作為各種異常的基礎(chǔ)對(duì)象,還有多個(gè)衍生的具體的錯(cuò)誤類型,這些錯(cuò)誤對(duì)象類型在nodejs中也可應(yīng)用。
Error作為內(nèi)置對(duì)象,它本身數(shù)據(jù)類型是 function,但被引用時(shí)它的數(shù)據(jù)類型是 object,和 Object、Array 類似,使用 typeof 進(jìn)行判斷如下:
typeof Error // 'function' typeof Error() // 'object' typeof new Error() // 'object'
關(guān)于typeof的詳細(xì)知識(shí),可參考本博前文一文搞懂js中的typeof用法
Error語(yǔ)法
下面介紹下Error對(duì)象基本的語(yǔ)法知識(shí)。
Error對(duì)象既可以當(dāng)作構(gòu)造函數(shù)使用,也可以當(dāng)作方法,一般有兩個(gè)可選參數(shù):
new Error(message, options) Error(message, options)
可選參數(shù)說(shuō)明如下:
- message:錯(cuò)誤信息描述
- options:屬性對(duì)象
- cause:指定錯(cuò)誤的具體原因
Error屬性和方法
Error實(shí)例必然包含 message 屬性,除此外一般還提供 name 和 stack 屬性,而 cause 屬性則根據(jù)定義來(lái)確定。
- message:錯(cuò)誤信息描述
- name:錯(cuò)誤的類型名字
- stack:錯(cuò)誤的堆棧軌跡,用于堆棧追蹤
- cause:當(dāng)前錯(cuò)誤被拋出的具體原因
下面通過(guò)一個(gè)示例,看下具體的屬性信息:
const err = new Error('發(fā)生錯(cuò)誤!', { cause: '333' })
console.log(err)
// Error: 發(fā)生錯(cuò)誤!
// at <anonymous>:1:13
console.log(err.message)
// '發(fā)生錯(cuò)誤!'
console.log(err.cause)
// '333'
console.log(err.stack)
// Error: 發(fā)生錯(cuò)誤!
// at <anonymous>:1:13
如上代碼,定義了一個(gè)錯(cuò)誤對(duì)象,并賦予兩個(gè)參數(shù),在控制臺(tái)輸出,可以看到該錯(cuò)誤對(duì)象具體的屬性信息。
需要注意的是,只有定義了cause屬性的Error實(shí)例,才有該屬性,否則cause屬性不存在,如下所示:
const err2 = new Error('發(fā)生錯(cuò)誤!')
console.log(err2.cause)
// undefined
err2.cause的輸出為undefined,因?yàn)闃?gòu)造函數(shù)并沒(méi)有定義該屬性。
Error對(duì)象沒(méi)有自己特有的實(shí)例方法,只有繼承自O(shè)bject對(duì)象的,這里略過(guò)。
六種常見(jiàn)錯(cuò)誤類型
Error對(duì)象衍生有六種常見(jiàn)的錯(cuò)誤類型,屬于Error的派生類,屬性和方法也都繼承自Error,下面一一介紹下這六種類型。
SyntaxError
SyntaxError 語(yǔ)法錯(cuò)誤,表示JS代碼發(fā)生的語(yǔ)法上的錯(cuò)誤,包括各種不符合語(yǔ)法規(guī)范、書(shū)寫(xiě)錯(cuò)漏等情況。
如下變量名錯(cuò)誤:
const 11 = 8 // Uncaught SyntaxError: Unexpected number
錯(cuò)誤的代碼語(yǔ)法:
Error(+) // Uncaught SyntaxError: Unexpected token ')'
SyntaxError語(yǔ)法錯(cuò)誤無(wú)法被捕獲,因?yàn)檎Z(yǔ)法錯(cuò)誤不會(huì)被執(zhí)行,直接拋出錯(cuò)誤,所幸的是,現(xiàn)在的IDE工具和各種插件,已可規(guī)避大部分的語(yǔ)法錯(cuò)誤。
TypeError
TypeError 類型錯(cuò)誤,當(dāng)代碼中的變量參數(shù)等類型不對(duì)時(shí),就會(huì)發(fā)生該類型錯(cuò)誤。
比如,把屬性當(dāng)方法使用:
window.location() // Uncaught TypeError: window.location is not a function // at <anonymous>:1:8
錯(cuò)誤的構(gòu)造函數(shù)使用:
new null() // Uncaught TypeError: null is not a constructor // at <anonymous>:1:1
ReferenceError
ReferenceError 引用錯(cuò)誤,當(dāng)引用一個(gè)并不存在的變量時(shí)會(huì)發(fā)生的錯(cuò)誤。
如直接在瀏覽器控制打?。?/p>
a
// Uncaught ReferenceError: a is not defined
// at <anonymous>:1:1
cons.log('')
// Uncaught ReferenceError: cons is not defined
// at <anonymous>:1:1
錯(cuò)誤的值分配,給 null 賦值:
null = 1 // Uncaught SyntaxError: Invalid left-hand side in assignment
RangeError
RangeError 取值范圍錯(cuò)誤,當(dāng)給某個(gè)對(duì)象指定一個(gè)不在取值范圍內(nèi)的特定值時(shí)發(fā)生的錯(cuò)誤。
如給Array對(duì)象傳入不合法的長(zhǎng)度參數(shù)
Array(-1) Array(Infinity) // Uncaught RangeError: Invalid array length // at <anonymous>:1:1
數(shù)字類型方法的使用:
5..toFixed(200) // Uncaught RangeError: toFixed() digits argument must be between 0 and 100 // at Number.toFixed (<anonymous>) // at <anonymous>:1:4
toFixed() 參數(shù)取值范圍在0到100之間,超過(guò)則會(huì)報(bào)錯(cuò)。
URIError
URIError 當(dāng)使用URI相關(guān)方法處理數(shù)據(jù)時(shí),當(dāng)這些方法的參數(shù)不正確時(shí)導(dǎo)致的一些錯(cuò)誤。
主要常見(jiàn)于URI的解碼等方法decodeURI()、decodeURIComponent()等。
decodeURI('%')
decodeURIComponent('%')
// Uncaught URIError: URI malformed
// at decodeURIComponent (<anonymous>)
// at <anonymous>:1:1
EvalError
EvalError 當(dāng)在使用eval函數(shù)時(shí),發(fā)生的錯(cuò)誤。eval不被推薦使用,該錯(cuò)誤類型一般很少見(jiàn),處于半廢棄狀態(tài),為了兼容考慮才存在。
自定義錯(cuò)誤類型
除了JavaScript自帶的常見(jiàn)錯(cuò)誤類型以外,我們還可以自定義特殊的錯(cuò)誤類型。
處理起來(lái)也很簡(jiǎn)單,使用繼承Error對(duì)象的方式即可。
class CharError extends Error {
constructor(message = '字符錯(cuò)誤') {
super(message)
this.name = 'CharError'
}
}
以上代碼使用es6的類繼承方式,自定義一個(gè)錯(cuò)誤類型繼承Error對(duì)象,后續(xù)就可以使用新的 CharError 類型。
const ce = new CharError() console.log(ce) // CharError: 字符錯(cuò)誤 // at error.html:26:16
如上,與JavaScript內(nèi)置錯(cuò)誤類型使用方式一致。
到此這篇關(guān)于JavaScript中的Error錯(cuò)誤對(duì)象與自定義錯(cuò)誤類型的文章就介紹到這了,更多相關(guān)js 錯(cuò)誤對(duì)象error內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
用js編寫(xiě)的簡(jiǎn)單的計(jì)算器代碼程序
這篇文章主要介紹了用js編寫(xiě)的簡(jiǎn)單的計(jì)算器代碼程序,非常具有實(shí)用性,感興趣的小伙伴可以參考下2015-08-08
JavaScript使用Proxy編寫(xiě)一個(gè)取值限制器
最近一直在開(kāi)發(fā)低代碼平臺(tái)的東西,由于項(xiàng)目里面東西有點(diǎn)多,取值或調(diào)用起來(lái)比較麻煩,使用本文就將使用Proxy編寫(xiě)一個(gè)取值限制器,需要的小伙伴可以參考下2023-12-12
基于ajax與msmq技術(shù)的消息推送功能實(shí)現(xiàn)代碼
這篇文章主要介紹了基于ajax與msmq技術(shù)的消息推送功能實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,有興趣的可以了解一下。2016-12-12
layui表格設(shè)計(jì)以及數(shù)據(jù)初始化詳解
今天小編就為大家分享一篇layui表格設(shè)計(jì)以及數(shù)據(jù)初始化詳解,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-10-10
JS數(shù)組返回去重后數(shù)據(jù)的方法解析
本文主要分享了Js數(shù)組返回去重后的數(shù)據(jù)的實(shí)例代碼。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01
JS Pro-深入面向?qū)ο蟮某绦蛟O(shè)計(jì)之繼承的詳解
一般的面向?qū)ο蟪绦蛘Z(yǔ)言,有兩種繼承方法——接口繼承(interface inheritance)和實(shí)現(xiàn)繼承(implementation inheritance)。接口繼承只繼承方法簽名,而實(shí)現(xiàn)繼承則繼承實(shí)際的方法。在JavaScript中,函數(shù)沒(méi)有簽名,所以在JavaScript只支持實(shí)現(xiàn)繼承,而且主要是依靠原型鏈(prototype chaining)來(lái)是實(shí)現(xiàn)的2013-05-05
利用JS解決ie6不支持max-width,max-height問(wèn)題的方法
本篇文章主要介紹了利用JS解決ie6不支持max-width,max-height問(wèn)題的方法。需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2014-01-01

