js 對象通過 json 序列化方法 JSON.stringfy() 輸出非空對象結果為空 '{}'

問題

如題，js 中對象 json 序列化方法 JSON.stringfy () 輸出非空對象結果為 '{}'

想要獲取移動端當前的網絡類型，在網上找到兩個方法，一個是借助 navigator.userAgent 里面包含的 NetType 信息判斷，還有一個是 navigator.connection 中的 type 字段判斷的。

測試結果一直不如意，開始懷疑判斷所依據的字段或者字符串並不存在。而對於 navigator 中除了 ua 之外還有哪些信息並不知道，所以想輸出全局變量 navigator 看一下。

alert(JSON.stringfy(navigator)) 結果一直為 '{}'。雖然通過 console.log(navigator) 輸出對象內容，得到了我想要的東西，但我還是好奇，為什么在 js 中專門用來序列化對象的 JSON.stringfy() 會不起作用。

解決

網上查看了一下資料，你可能不知道的 JSON.stringfy 用法。里面提到，JSON.stringfy() 用途廣泛，很多 js 框架底層的 toJson() 都用了這個來實現的。但是它本身對於某些值的處理是出乎意料的，比如說，JSON.stringify() 會將 NaN 和 Infinity 轉化為 null:

const obj = { nan: parseInt('not a number'), inf: Number.POSITIVE_INFINITY };

JSON.stringify(obj); // '{"nan":null,"inf":null}'

還有一種會拋出錯誤異常的情況：

const obj = {};
// 存在循環引用的對象，它指向它本身
obj.prop = obj;

// 會拋出 "TypeError: TypeError: Converting circular structure to JSON" 異常
JSON.stringify(obj)

並且，JSON.stringify () 也會直接省略那些值為 functions 和 undefined 的屬性，如下：

const obj = { fn: function() {}, undef: undefined };

// 它會返回空對象
JSON.stringify(obj); // '{}'

所以，json 序列化返回 '{}'，就是因為 nav­i­ga­tor 並不是一個純粹的數據，它內部包含了一些 func­tions。

這樣自然就不能通過 JSON.stringify(obj) 輸出查看到對象內容了。