JSON.stringify 方法

原创

编程三昧 2023-09-05 23:47:02 博主文章分类：JavaScript ©著作权

文章标签 JSON 序列化字符串 文章分类 JavaScript 前端开发

©著作权归作者所有：来自51CTO博客作者编程三昧的原创作品，请联系作者获取转载授权，否则将追究法律责任

JSON 对象是我们经常使用的一种数据存储对象，它的适用范围非常广。

而 JSON.stringify 方法的使用频率也极高，合理使用 stringify 方法，我们可以实现很多简单需求：

要实现对象的深拷贝时，我们可以用 JSON 对象的 JSON.stringify 和 JSON.parse 来拷贝一个完全一样的对象，而不会对原对象产生任何引用关系。
在使用 localStorage 时，也会用到它，因为 localStorage 只能存储字符串格式的内容，所以，我们在存之前，将数值转换成 JSON字符串。

JSON.stringify

JSON.stringify 方法可以帮我们把一个对象或数组转换成一个 JSON字符串。

我们通常只会用到它的第一个参数，其实它还有另外两个参数，可以让它实现一些非常好用的功能。

语法：

JSON.stringify(value[, replacer [, space]])

参数：

value：将要被序列化的变量的值
replacer：替代器。可以是函数或者是数组，如果是一个函数，则value 每个属性都要经过这个函数的处理，该函数的返回值就是最后被序列化后的值。如果是一个数组，则要求该数组的元素是字符串，且这些元素会被当做value 的键（key）进行匹配，最后序列化的结果，是只包含该数组每个元素为key 的值。
space：指定输出数值的代码缩进，美化格式之用，可以是数字或者字符串。如果是数字（最大为10）的话，代表每行代码的缩进是多少个空格。如果是字符串的话，该字符串（最多前十个字符）将作显示在每行代码之前。

这时候，你应该知道了。我们可以用JSON.stringify 来做序列化时的过滤，相当于我们可以自定义JSON.stringify 的解析逻辑。

使用函数过滤并序列化对象

function replacer(key, value) {
    if (typeof value === "string") {
        return undefined;
    }
    return value;
}
var foo = {
    foundation: "Mozilla",
    model: "box",
    week: 45,
    transport: "car",
    month: 7
};
var jsonString = JSON.stringify(foo, replacer); // {"week":45,"month":7}

使用数组过滤并序列化对象

const user = {
    name: "zollero",
    nick: "z",
    skills: ["JavaScript", "CSS", "HTML5"]
};
JSON.stringify(user, ["name", "skills"], 2); 
// "{//   "name": "zollero",//   "skills": [//     "JavaScript",//     "CSS",//     "HTML5"//   ]// }"

还有一个有意思的东西，是对象的toJSON 属性。

如果一个对象有toJSON 属性，当它被序列化的时候，不会对该对象进行序列化，而是将它的toJSON 方法的返回值进行序列化。

看下面的例子：

var obj = {
    foo: "foo",
    toJSON: function () {
        return "bar";
    }
};
JSON.stringify(obj); 
// '"bar"'JSON.stringify({x: obj}); // '{"x":"bar"}'