JSON.stringify() 這個 API 想必大家都用過，可以幫助我們將數據解析成字符串類型，如下是個例子：
const obj = {
name: 'foo',
level: 'low',
age: '100',
money: 'empty'
}
JSON.stringify(obj)
// "{"name":"foo","level":"low","age":"100","money":"empty"}"
想必這樣的寫法大家都知道，但是其實 JSON.stringify 總共接受三個參數。
第二個參數可以傳入一個數組或者函數。
我們先來看看傳入數組的話結果會是什麼？
JSON.stringify(obj, ['name', 'age'])
// "{"name":"foo","age":"100"}"
當我們傳入數組時候，只有數組內的屬性名才會被正常序列化。
那麼當第二個參數傳入函數會發生什麼呢？
const obj1 = { name: new Set([1]) }
JSON.stringify(obj1, (key, value) => {
return value instanceof Set ? [...value] : value
})
// 正常序列化是 "{"name":{}}"
// 例子中的輸出為 "{"name":[1]}"
我們都知道 JSON.stringify 是不能處理某些值的，就比如例子中的 Set 類型的值就不能正常序列化。但是其實我們可以通過傳入函數的方式幫助我們將 Set 類型的值轉換為數組類型，從而使得數據能夠被正常序列化。
第三個參數可以傳入數字或者字符串類型，該參數用於美化輸出。正常來說輸出的結果都是一行文本，在數據量小的時候閱讀起來沒啥壓力，但是當數據量龐大的時候就會增加閱讀難度。這個參數在這種時候就能幫助到我們。
JSON.stringify(obj, null, 2)
// "{
// "name": "foo",
// "level": "low",
// "age": "100",
// "money": "empty"
// }"
當傳入數字時，每個屬性都會換行並且帶有縮進空格。
JSON.stringify(obj, null, '')
// "{
// "name": "foo",
// "level": "low",
// "age": "100",
// "money": "empty"
//}"
當傳入字符串時，每個屬性照樣都會換行並且在開頭加上你傳入的字符串。
以上就是本篇文章的內容了，雖然這單純屬於 API 範疇的知識，但是我相信很多人應該並不知道 JSON.stringify 還擁有這樣的能力。
分享到:
閱讀更多 JavaScript前端 的文章
