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

翻译 | 杨小爱

介绍

JSON 对象在所有现代浏览器中都可用，它有两种有用的方法来处理 JSON 格式的内容：解析和字符串化。

JSON.parse()

JSON.parse() 接受 JSON 字符串并将其转换为 JavaScript 对象。

let userStr = '{"name":"Sammy","email":"sammy@example.com","plan":"Pro"}';
let userObj = JSON.parse(userStr);
console.log(userObj);

执行此代码将产生以下输出：

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

尾随逗号在 JSON 中无效，因此，如果传递给它的字符串有尾随逗号，则 JSON.parse() 会引发错误。

JSON.parse() 可以将函数作为第二个参数，该函数可以在返回对象值之前对其进行转换。

在这里，对象的值在 parse 方法的返回对象中转换为大写：

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

执行此代码将产生以下输出：

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

这些值已转换为大写字符。

JSON.stringify()

JSON.stringify() 接受一个 JavaScript 对象并将其转换为 JSON 字符串。

let userObj = {  name: "Sammy",  email: "sammy@example.com",  plan: "Pro"};
let userStr = JSON.stringify(userObj);
console.log(userStr);

执行此代码将产生以下输出：

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

JSON.stringify() 可以接受两个额外的参数。第一个是替换功能。第二个是字符串或数字值，用作返回字符串中的空格。

replacer 函数可用于过滤掉值，因为任何作为 undefined 返回的值都将在返回的字符串之外：

let userObj = {  name: "Sammy",  email: "sammy@example.com",  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);

执行此代码将产生以下输出：

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

电子邮件键值对已从对象中删除。

还有一个传入空间参数的示例：

let userObj = {  name: "Sammy",  email: "sammy@example.com",  plan: "Pro"};
let userStrSpace = JSON.stringify(user, null, '...');
console.log(userStrSpace);

执行此代码将产生以下输出：

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

缩进已被替换为...

总结

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

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

学习更多技能
请点击下方公众号

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

学习更多技能请点击下方公众号

学习更多技能
请点击下方公众号