javascript json_JavaScript之JSON.stringify的5个秘密

一名 JavaScript 开发人员，JSON.stringify() 应该是我们经常用于调试的最常见函数。它的作用是什么呢，难道我们不能使用 console.log() 来做同样的事情吗？让我们试一试。

首字母缩略词 Json 在木板上

//初始化一个 user 对象const user = { "name" : "Zhangsan", "age" : 22}console.log(user);// 打印结果：[object Object]

很明显，我们打印的是一个对象，不能显示出来我们想要的结果。如果通过某种方式打印出来字符串呢？我们就需要使用 JSON.stringify() 首先将对象转换成字符串，然后在控制台中打印，如下所示。

const user = { "name" : "Zhangsan", "age" : 22}console.log(JSON.stringify(user));// 结果 "{ "name" : "Zhangsan", "age" : 22 }"

我们知道，结果出来了。其实平时，我们使用 stringify 函数的场景是较为普遍的，就像我们在上面做的那样。但我要告诉你一些隐藏的秘密，这些小秘密会让你开发起来更加轻松。

1: 第二个参数(数组)

是的，stringify 函数也可以有第二个参数。它是要在控制台中打印的对象的键数组。看起来很简单？让我们更深入一点。我们有一个对象 user 并且我们想知道 user 的 name 属性值。当我们将其打印出来： console.log(JSON.stringify(user)); 它会输出下面的结果。

{"id":1,"name":"Lucy",age:12,sex:"女"}

在日志中我们只想看到打印name，那我们该怎么做呢？当然，我们可以直接使用console.log(user.name),但是我们还可以使用这种方式,如下：

console.log(JSON.stringify(user,['name' ]);// 结果{"name" : "Lucy"}

2: 第二个参数(函数)

我们还可以传入函数作为第二个参数。如下，如果返回 undefined，则不会打印键值对。

const user = { "name" : "Lisi", "age" : 33}

实现方式：

console.log(JSON.stringify(user,(key,value)=>{if(typeof value == 'string'){   return  undefined  }  return value});

这样就可以实现过滤了，满足条件的才可以打印出来结果。

3: 第三个参数为数字

如果第三个参数是一个数字，则字符串化中的每个级别都将缩进这个数量的空格字符。

JSON.stringify(user, null, 2);//打印，可以看到name和age前面有两个空格的缩进//{//  "name": "Lisi",//  "age": 33,//}

4: 第三个参数为字符串

如果第三个参数是 string，那么将使用它来代替上面显示的空格字符。

JSON.stringify(user, null,'**');//{//**"name": "Lisi",//**"age": 33,//}// 这里 * 取代了空格字符，

当然打印，我们也可以借助我们的console本身来实现。

console.log('',user);//打印 是一样的。//{//  "name": "Lisi",//  "age": 33,//}console.log('',user.name);//打印//Lisi

总结

其实JSON.stringify是我们经常使用的知识，我们在这里主要是为了对JSON.stringify函数进行介绍和学习，让大家对其有更加深刻的印象。希望对我们有多的帮助。

关注我，每天都有新知识学习。