英文 | https://www.digitalocean.com/community/tutorials/js-json-parse-stringify

翻譯 | 楊小愛

介紹

JSON 對象在所有現(xiàn)代瀏覽器中都可用，它有兩種有用的方法來處理 JSON 格式的內(nèi)容：解析和字符串化。

JSON.parse()

JSON.parse() 接受 JSON 字符串并將其轉(zhuǎn)換為 JavaScript 對象。

let userStr = '{"name":"Sammy","email":"[email protected]","plan":"Pro"}';
let userObj = JSON.parse(userStr);
console.log(userObj);

執(zhí)行此代碼將產(chǎn)生以下輸出：

Output{name: 'Sammy', email: '[email protected]', plan: 'Pro'}  email: "sammy@example.com"  name: "Sammy"  plan: "Pro"

尾隨逗號在 JSON 中無效，因此，如果傳遞給它的字符串有尾隨逗號，則 JSON.parse() 會引發(fā)錯誤。

JSON.parse() 可以將函數(shù)作為第二個參數(shù)，該函數(shù)可以在返回對象值之前對其進行轉(zhuǎn)換。

在這里，對象的值在 parse 方法的返回對象中轉(zhuǎn)換為大寫：

let userStr = '{"name":"Sammy","email":"[email protected]","plan":"Pro"}';
let userObj = JSON.parse(userStr, (key, value) => {  if (typeof value === 'string') {    return value.toUpperCase();  }  return value;});
console.log(userObj);

執(zhí)行此代碼將產(chǎn)生以下輸出：

Output{name: 'SAMMY', email: '[email protected]', plan: 'PRO'}  email: "SAMMY@EXAMPLE.COM"  name: "SAMMY"  plan: "PRO"

這些值已轉(zhuǎn)換為大寫字符。

JSON.stringify()

JSON.stringify() 接受一個 JavaScript 對象并將其轉(zhuǎn)換為 JSON 字符串。

let userObj = {  name: "Sammy",  email: "[email protected]",  plan: "Pro"};
let userStr = JSON.stringify(userObj);
console.log(userStr);

執(zhí)行此代碼將產(chǎn)生以下輸出：

Output{"name":"Sammy","email":"[email protected]","plan":"Pro"}

JSON.stringify() 可以接受兩個額外的參數(shù)。第一個是替換功能。第二個是字符串或數(shù)字值，用作返回字符串中的空格。

replacer 函數(shù)可用于過濾掉值，因為任何作為 undefined 返回的值都將在返回的字符串之外：

let userObj = {  name: "Sammy",  email: "[email protected]",  plan: "Pro"};
function replacer(key, value) {  console.log(typeof value);  if (key === 'email') {    return undefined;  }  return value;}
let userStrReplacer = JSON.stringify(userObj, replacer);
console.log(userStrReplacer);

執(zhí)行此代碼將產(chǎn)生以下輸出：

Output{"name":"Sammy","plan":"Pro"}

電子郵件鍵值對已從對象中刪除。

還有一個傳入空間參數(shù)的示例：

let userObj = {  name: "Sammy",  email: "[email protected]",  plan: "Pro"};
let userStrSpace = JSON.stringify(user, null, '...');
console.log(userStrSpace);

執(zhí)行此代碼將產(chǎn)生以下輸出：

Output{..."name": "Sammy",..."email": "[email protected]",..."plan": "Pro"}

縮進已被替換為...

總結(jié)

在今天的教程中，我們使用了 JSON.parse() 和 JSON.stringify() 方法。

如何使用 JSON.parse() 和 JSON.stringify()

學習更多技能
請點擊下方公眾號

如何使用 JSON.parse() 和 JSON.stringify()

學習更多技能請點擊下方公眾號

學習更多技能
請點擊下方公眾號