|
|
|
|
|
|
贊助商
分類(lèi)目錄
贊助商
最新文章
搜索
JSON.stringify在轉(zhuǎn)換中忽略其值未定義undefined的字段
作者:admin 時(shí)間:2022-4-14 19:3:11 瀏覽:今天使用JSON時(shí)，發(fā)現(xiàn)了一個(gè)小問(wèn)題，及時(shí)修復(fù)了，記錄一下。然后自己又重新學(xué)習(xí)了JSON.stringify，發(fā)現(xiàn)其還有很多平時(shí)沒(méi)有注意的特性。
發(fā)現(xiàn)問(wèn)題
用戶提交的表單，如果數(shù)據(jù)完整，那么JSON是這樣：
[
{
"fieldId": 539,
"value": "silver card"
},
{
"fieldId": 540,
"value": "2021-03-01"
},
{
"fieldId": 546,
"value": "10:30"
}
]
然后會(huì)變成這樣：
'[{"fieldId":539,"value":"silver card"},{"fieldId":540,"value":"2021-03-01"},{"fieldId":546,"value":"10:30"}]'但是當(dāng)用戶提交的數(shù)據(jù)不完整時(shí)，數(shù)據(jù)會(huì)變成這樣：
[
{
fieldId: 539,
value: undefined
},
{
fieldId: 540,
value: undefined
},
{
fieldId: 546,
value: undefined
},
]
然后會(huì)變成這樣：
'[{"fieldId":539},{"fieldId":540},{"fieldId":546}]'當(dāng)這個(gè)數(shù)據(jù)被發(fā)送到后端時(shí)，后端如果沒(méi)處理好，就會(huì)導(dǎo)致錯(cuò)誤，因?yàn)?span style="color: #ff0000">缺少了value屬性。
解決問(wèn)題
這是因?yàn)椋?code>JSON.stringify 在轉(zhuǎn)換過(guò)程中忽略其值未定義的字段。
問(wèn)題的原因找到了，解決方法也很簡(jiǎn)單，將值為undefined的項(xiàng)轉(zhuǎn)為空字符串提交即可。
let signInfo = [
{
fieldId: 539,
value: undefined
},
{
fieldId: 540,
value: undefined
},
{
fieldId: 546,
value: undefined
},
]
let newSignInfo = signInfo.map((it) => {
const value = typeof it.value === 'undefined' ? '' : it.value
return {
...it,
value
}
})
console.log(JSON.stringify(newSignInfo))
// '[{"fieldId":539,"value":""},{"fieldId":540,"value":""},{"fieldId":546,"value":""}]'
了解JSON.stringify
接下來(lái)我們來(lái)分析一下JSON.stringify這個(gè)內(nèi)置函數(shù)的一些特點(diǎn)。
基本上， JSON.stringify 將對(duì)象轉(zhuǎn)換為 JSON 字符串。
同時(shí)，JSON.stringify 有以下規(guī)則。
1、undefined、Function和Symbol不是有效的 JSON 值。
如果在轉(zhuǎn)換過(guò)程中遇到任何此類(lèi)值，則它們要么被忽略（在對(duì)象中找到時(shí)），要么被更改為null（在數(shù)組中找到時(shí)）。JSON.stringify()可以在傳入“純”值（如JSON.stringify(function() {})或JSON.stringify(undefined) ）時(shí)返回undefined。
console.log(JSON.stringify(
{
name: Symbol('卡卡測(cè)速網(wǎng)'),
value: undefined,
showName: () =>
{}
}))
上述語(yǔ)句的執(zhí)行結(jié)果是返回undefined：
2、Boolean, Number和String對(duì)象在字符串化過(guò)程中被轉(zhuǎn)換為對(duì)應(yīng)的原始值，符合傳統(tǒng)的轉(zhuǎn)換語(yǔ)義。
3、所有Symbol帶鍵的屬性都將被完全忽略，即使在使用replacer函數(shù)時(shí)也是如此。
4、數(shù)字Infinity和NaN以及null都被認(rèn)為null。
5、如果值有toJSON()方法，它負(fù)責(zé)定義哪些數(shù)據(jù)將被序列化。
6、實(shí)例通過(guò)返回字符串來(lái)Date實(shí)現(xiàn)toJSON()功能（同date.toISOString()）。因此，它們被視為字符串。
const d = new Date();
console.log(d.toJSON());
console.log(JSON.stringify(d));
執(zhí)行結(jié)果
總結(jié)
因?yàn)橐粋€(gè)bug，我今天重新學(xué)習(xí)了JSON.stringify，發(fā)現(xiàn)它還有很多平時(shí)沒(méi)有注意到的特性。同時(shí)也希望大家以后不要犯同樣的錯(cuò)誤。
您可能對(duì)以下文章也感興趣
標(biāo)簽: JSON JSON.stringify
- 站長(zhǎng)推薦
