JS中的Error對象及使用JSON.stringify()序列化Error問題
一. 錯誤對象的類型
Error
: 所有錯誤類型的父類型;SyntaxError
: 語法錯誤,表示程序的語法使用錯誤;
console.log(" "" ") ; // Uncaught SyntaxError: missing ) after argument list
ReferenceError
: 引用錯誤,表示引用的變量不存在;
console.log(a); // Uncaught ReferenceError: a is not defined
TypeError
: 類型錯誤,表示使用了錯誤的數(shù)據(jù)類型
let a; console.log(a.name); // Uncaught TypeError: Cannot read properties of undefined (reading 'name') RangeError:范圍錯誤, 數(shù)據(jù)值不在其所允許的范圍內(nèi)(函數(shù)遞歸調(diào)用容易出現(xiàn)此錯誤) // 保留小數(shù)點多少位 (10.24).toFixed(-1); ?// toFixed() digits argument must be between 0 and 100 URIError: URI錯誤,向全局 URI 處理函數(shù)(decodeURI、decodeURIComponent)傳遞一個不合法的URI時,URIError 錯誤會被拋出 // 解碼URI地址 ? 錯誤:格式不正確 console.log(decodeURI("%") ); ? // URIError: URI malformed
以上都是不同錯誤類型的 Error構(gòu)造函數(shù),能通過new 創(chuàng)建錯誤對象
錯誤處理
捕獲錯誤 try ... catch
try { ? ? // 正常書寫的程序代碼(可能會出錯的代碼) } catch (err) { ? ? // err: try中執(zhí)行語句發(fā)生錯誤時,自動創(chuàng)建err錯誤對象,并將錯誤信息保存在對象err中 ? ? // 執(zhí)行錯誤處理 } finally { ? ? // 一般用于釋放資源 ? ? // finally 可有可無,因為try ... catch 之后的代碼本來就會執(zhí)行 }
- 放在try...catch中的代碼,執(zhí)行效率會降低;
- 盡量少的將代碼放入try...catch中;
- 如果可提前預知錯誤原因,可用 if...else 代替,提前預防錯誤。
拋出錯誤 throw error
通過throw,主動拋出異常錯誤;
throw new Error("錯誤信息");
錯誤對象的屬性:
name
屬性: 錯誤類型;message
屬性: 錯誤相關的描述信息;stack
屬性:函數(shù)調(diào)用棧記錄信息(錯誤相關信息,錯誤出現(xiàn)的位置)
try{ ? ? console.log(a); ? ? } catch (err) { ? ? console.log(err.name); ? ? ? ?// ReferenceError ? ? console.log(err.message); ? ? // a is not defined }
二.使用JSON.stringfy()去序列化一個 Error
最近在做Node 服務端 測試的時候,遇到 打log JSON.stringify(error)為{}的問題,這樣的情況導致根本無法定位到具體問題。
例如:
JSON.stringify()
: 它能夠方便地把一個對象轉(zhuǎn)化成字符串;
但是,它也有一個較大的缺點,就是無法直接處理如Error 這類的對象。
const err = new Error('This is an error') JSON.stringify(err) // '{}'
在控制臺運行上述代碼后會發(fā)現(xiàn),JSON.stringify() 的結(jié)果是一個字符串的 "{}",里面沒有任何有效內(nèi)容。這是否意味著 JSON.stringify() 確實無法處理 Error 呢?下面我們來看看在 MDN 里這個函數(shù)是如何定義的。
MDN 定義
JSON.stringify()將值轉(zhuǎn)換為相應的JSON格式:
- 轉(zhuǎn)換值如果有toJSON()方法,該方法定義什么值將被序列化。
- 非數(shù)組對象的屬性不能保證以特定的順序出現(xiàn)在序列化后的字符串中。
- 布爾值、數(shù)字、字符串的包裝對象在序列化過程中會自動轉(zhuǎn)換成對應的原始值。
- undefined、任意的函數(shù)以及 symbol 值,在序列化過程中會被忽略(出現(xiàn)在非數(shù)組對象的屬性值中時)或者被轉(zhuǎn)換成 null(出現(xiàn)在數(shù)組中時)。函數(shù)、undefined被單獨轉(zhuǎn)換時,會返回undefined,如JSON.stringify(function(){}) or JSON.stringify(undefined).
- 對包含循環(huán)引用的對象(對象之間相互引用,形成無限循環(huán))執(zhí)行此方法,會拋出錯誤。
- 所有以 symbol 為屬性鍵的屬性都會被完全忽略掉,即便 replacer 參數(shù)中強制指定包含了它們。
- Date日期調(diào)用了toJSON()將其轉(zhuǎn)換為了string字符串(同Date.toISOString()),因此會被當做字符串處理。
- NaN和Infinity格式的數(shù)值及null都會被當做null。
- 其他類型的對象,包括Map/Set/weakMap/weakSet,僅會序列化可枚舉的屬性。
“僅會序列化可枚舉的屬性”,是什么意思呢?眾所周知,在 JS 的世界中一切皆對象,對象有著不同的屬性,這些屬性是否可枚舉,我們用 enumerable 來定義.
對象屬性的 enumerable
舉個例子,我們用 obj = { a: 1, b: 2, c: 3 } 來定義一個對象,然后設置它的 c 屬性為“不可枚舉”,看看效果會如何:
首先看處理前的效果:
const obj = {a: 1,b: 2,c: 3}; JSON.stringify(obj) // '{"a":1,"b":2,"c":3}'
再看處理后的效果:
const obj = { a: 1, b: 2, c: 3 } ? Object.defineProperty(obj, 'c', { ? value: 3, ? enumerable: false }) ? JSON.stringify(obj) ? // => "{"a":1,"b":2}"
可以看到,在對 c 屬性設置為不可枚舉以后,JSON.stringify() 便不再對其進行序列化。
我們把問題再深入一些,有沒有辦法能夠獲取一個對象中包含不可枚舉在內(nèi)的所有屬性呢?答案是使用 Object.getOwnPropertyNames() 方法。
依然是剛剛被改裝過的 obj 對象,我們來看看它所包含的所有屬性:
Object.getOwnPropertyNames(obj) ? // => ["a", "b", "c"]
不可枚舉的 c 屬性也被獲取到了!
用同樣的方法,我們來看看一個 Error 都包含哪些屬性:
const err = new Error('This is an error') Object.getOwnPropertyNames(err) ? // => ["stack", "message"]
可以看到,Error 包含了 stack 和 message 兩個屬性,它們均可以使用點運算符 . 從 err 實例里面拿到。
既然我們已經(jīng)能夠獲取 Error 實例的不可枚舉屬性及其內(nèi)容,那么距離使用 JSON.stringify() 序列化 Error 也已經(jīng)不遠了!
JSON.stringify() 的第二個參數(shù)
JSON.stringify() 可以接收三個參數(shù):
語法:
JSON.stringify(value[, replacer [, space]])
value
- 將要序列化成 一個JSON 字符串的值。
replacer
可選- 如果該參數(shù)是一個函數(shù),則在序列化過程中,被序列化的值的每個屬性都會經(jīng)過該函數(shù)的轉(zhuǎn)換和處理;如果該參數(shù)是一個數(shù)組,則只有包含在這個數(shù)組中的屬性名才會被序列化到最終的 JSON 字符串中;如果該參數(shù)為null或者未提供,則對象所有的屬性都會被序列化。
space
可選- 指定縮進用的空白字符串,用于美化輸出(pretty-print);如果參數(shù)是個數(shù)字,它代表有多少的空格;上限為10。該值若小于1,則意味著沒有空格;如果該參數(shù)為字符串(字符串的前十個字母),該字符串將被作為空格;如果該參數(shù)沒有提供(或者為null)將沒有空格。
- 返回值 節(jié)
- 一個表示給定值的JSON字符串。
我們來看 replacer 的用法:
……如果該參數(shù)是一個數(shù)組,則只有包含在這個數(shù)組中的屬性名才會被序列化到最終的 JSON 字符串中……
依然使用上文的 obj 為例子:
const obj = { a: 1, b: 2, c: 3 } ? Object.defineProperty(obj, 'c', { ? value: 3, ? enumerable: false }) ? JSON.stringify(obj, ['a', 'c']) ? // => "{"a":1,"c":3}"
可以看到,我們在 replacer 中指定了要序列化 a 和 c 屬性,輸出結(jié)果也是只有這兩個屬性的值,且不可枚舉的 c 屬性也被序列化了!守得云開見月明,Error 對象被序列化的方法也就出來了:
const err = new Error('This is an error') ? JSON.stringify(err, Object.getOwnPropertyNames(err), 2) ? // =>? // "{ // ? "stack": "Error: This is an error\n ? ?at <anonymous>:1:13", // ? "message": "This is an error" // }"
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
JS中的oninput和onchange事件的區(qū)別及如何正確使用
在JavaScript中,oninput和onchange事件是用于處理用戶輸入的常見事件,本文將介紹oninput和onchange事件的區(qū)別,以及如何在實際開發(fā)中正確使用它們,感興趣的朋友跟隨小編一起看看吧2023-10-10JavaScript圖片的Base64編碼以及轉(zhuǎn)換詳解
現(xiàn)在網(wǎng)站為了提升用戶的瀏覽體驗越來越多的使用了圖片,而這些圖片通常以 Base64 的形式存儲和加載,下面這篇文章主要給大家介紹了關于JavaScript圖片的Base64編碼以及轉(zhuǎn)換的相關資料,需要的朋友可以參考下2022-07-07Ajax異步文件上傳與NodeJS express服務端處理
本文主要介紹了Ajax異步文件上傳與NodeJS express服務端處理的相關知識。具有很好的參考價值。下面跟著小編一起來看下吧2017-04-04JavaScript進制數(shù)之間的互相轉(zhuǎn)換
這篇文章主要介紹了JavaScript進制數(shù)之間的互相轉(zhuǎn)換,進制轉(zhuǎn)換是人們利用符號來計數(shù)的方法,下文基于JavaScript實現(xiàn)進制數(shù)之間的轉(zhuǎn)換,有一定的知識性參考價值,需要的小伙伴可以參考一下2022-05-05