JavaScript 有許多各司其職的函數(shù)。我們每天都在用敦捧,但不知道他們的額外功能须板。直到有一天看了文檔之后才發(fā)現(xiàn),它們?cè)瓉?lái)有許多超出我們想象的功能兢卵。JSON.stringify
就是其中一個(gè)习瑰。今天我們就來(lái)聊聊這個(gè)隱藏實(shí)力的選手。
基本用法
JSON.stringify
方法接受一個(gè)參數(shù)并將其轉(zhuǎn)換成JSON 字符串形式秽荤。
const firstItem = {
title: 'Transformers',
year: 2007
};
JSON.stringify(firstItem);
// {'title':'Transformers','year':2007}
當(dāng)出現(xiàn)一個(gè)不能序列化成 JSON 字符串的元素時(shí)就會(huì)出現(xiàn)問(wèn)題 甜奄。
const secondItem = {
title: 'Transformers',
year: 2007,
starring: new Map([[0, 'Shia LaBeouf'],[1, 'Megan Fox']])
};
JSON.stringify(secondItem);
// {'title':'Transformers','year':2007,'starring':{}}
第二個(gè)參數(shù)
JSON.stringify
還有第二個(gè)參數(shù)柠横,叫替換器參數(shù)。
你可以傳一個(gè)字符串?dāng)?shù)組贺嫂,作為對(duì)象屬性白名單滓鸠,這些屬性將會(huì)包含在輸出結(jié)果里。
JSON.stringify(secondItem, ['title']);
// {'title':'Transformers'}
我們可以篩掉一些不想要的值第喳。這些值要么太大(比如 Error 對(duì)象)糜俗,要么無(wú)法轉(zhuǎn)成可讀的JSON形式。
替換器參數(shù)也可以是一個(gè)函數(shù)曲饱。該函數(shù)接受 JSON.stringify
方法遍歷對(duì)象時(shí)當(dāng)前的屬性和值作為參數(shù)悠抹。如果函數(shù)不返回任何值或者返回 undefined,當(dāng)前節(jié)點(diǎn)就不會(huì)出現(xiàn)在結(jié)果里扩淀。
JSON.stringify(secondItem, (key, value) => {
if (value instanceof Set) {
return [...value.values()];
}
return value;
});
// {'title':'Transformers','year':2007,'starring':['Shia LaBeouf','Megan Fox']}
通過(guò)讓函數(shù)返回 undefined楔敌,可以在結(jié)果里刪除這些屬性。
JSON.stringify(secondItem, (key, value) => {
if (typeof value === 'string') {
return undefined;
}
return value;
});
// {"year":2007,"starring":{}}
第二個(gè)參數(shù)還可以用來(lái)創(chuàng)建簡(jiǎn)單的對(duì)象哈希函數(shù)驻谆。但有一點(diǎn)要注意卵凑,JSON.stringify(obj)
不能保證屬性的輸出順序,當(dāng)序列化的結(jié)果用于哈希/校驗(yàn)和的時(shí)胜臊,這點(diǎn)至關(guān)重要勺卢。為此,我們可以把第二個(gè)參數(shù)設(shè)置為Object.keys(obj).sort()
象对,對(duì)象將會(huì)以這個(gè)順序序列化黑忱。
function objectHash(obj: object): string {
const str = JSON.stringify(obj, Object.keys(obj).sort());
return createHash('sha1').update(str).digest('hex');
}
第三個(gè)參數(shù)。
第三個(gè)參數(shù)設(shè)置最終字符串里的空白縮進(jìn)勒魔。如果參數(shù)是一個(gè)數(shù)字甫煞,那么序列化的每個(gè)層級(jí)都會(huì)用這個(gè)數(shù)量的空格符縮進(jìn)。
JSON.stringify(secondItem, null, 2);
//{
// "title": "Transformers",
// "year": 2007,
// "starring": {}
//}
如果第三個(gè)參數(shù)是字符串冠绢,就會(huì)替代空格符抚吠。
JSON.stringify(secondItem, null, '??');
//{
//??"title": "Transformers",
//??"year": 2007,
//??"starring": {}
//}
toJSON 方法
如果我們序列化的對(duì)象有一個(gè)toJSON
方法,它將會(huì)采用自定義的序列化過(guò)程弟胀。你可以在方法里返回一個(gè)新的值埃跷,這個(gè)值將會(huì)替換原始對(duì)象被序列化。
const thirdItem = {
title: 'Transformers',
year: 2007,
starring: new Map([[0, 'Shia LaBeouf'],[1, 'Megan Fox']]),
toJSON() {
return {
name: `${this.title} (${this.year})`,
actors: [...this.starring.values()]
};
}
};
console.log(JSON.stringify(thirdItem));
// {"name":"Transformers (2007)","actors":["Shia LaBeouf","Megan Fox"]}
最后
查看我們?nèi)粘J褂玫暮瘮?shù)的文檔邮利,有時(shí)候會(huì)有不少收獲±В可能會(huì)有驚喜延届,我們也能學(xué)到不少東西。保持對(duì)知識(shí)的渴求贸诚,經(jīng)常讀讀文檔吧方庭!
交流
歡迎關(guān)注微信公眾號(hào)“1024譯站”厕吉,為你奉上更多技術(shù)干貨。