本篇内容主要讲解“JSON.stringify如何运用”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“JSON.stringify如何运用”吧!
计算
安全
数据库
网络和加速
企业服务
JSON.stringify(value[, replacer [, space]])replacer 参数可以是一个函数或者一个数组。作为函数，它有两个参数，键（key）和值（value），它们都会被序列化。
值得注意的是，在开始时, replacer 函数会被传入一个空字符串作为 key 值，value代表着要被 stringify 的这个对象。随后每个对象或数组上的属性会被依次传入。
总的来说 replacer 参数就是用来手动忽略一些不想被序列化的属性，有点类似过滤器的作用
var foo = {
id: 1,
name: "sf",
age: 18,
};
//作为函数，函数没有返回值或者返回值为 undefined 时，忽略这个属性值
JSON.stringify(foo, (key, value) => {
if (typeof value === "string") {
return undefined;
}
return value;
});
//{"id":1,"age":18}
//作为数组，数组的值代表将被序列化成 JSON 字符串的属性名
JSON.stringify(foo, ['id',"name"]);
//{"id":1,"name":"sf"}space 参数用来控制结果字符串里面的间距。如果是一个数字, 则在字符串化时每一级别会比上一级别缩进多这个数字值的空格（最多10个空格）；如果是一个字符串，则每一级别会比上一级别多缩进该字符串（或该字符串的前10个字符）。实际使用基本都是用来美化输出。
let a = JSON.stringify({ a: 1, b: 2 }, null, 2);
let b = JSON.stringify({ a: 1, b: 2 }, null, " ");
console.log(a == b); //true
JSON.stringify({ a: 1, b: 2 }, null, "--");
// {
// --"a": 1,
// --"b": 2
// }出现在对象属性值中: undefined、Symbol值、函数，在序列化过程中将会被忽略
出现在数组中: undefined、Symbol值、函数 会被转化为 null
单独转换时: 会返回 undefined
const obj = {
a: "a",
b: undefined,
c: Symbol(),
d: function () {},
};
JSON.stringify(obj)
// {"a":"a"}
const arry = [undefined, Symbol("c"), function () {}];
JSON.stringify(arry);
//[null,null,null]
JSON.stringify(undefined);
// undefined
JSON.stringify(Symbol(111));
// undefined
JSON.stringify(function () {});
// undefined正如在第一特性所说，JSON.stringify() 序列化时会忽略一些特殊的值，所以不能保证序列化后的字符串还是以特定的顺序出现（数组除外）。
JSON.stringify([new Boolean(true), new Number(1), new String("a")]);
// [true,1,"a"]const obj = {
a: "aaa",
toJSON() {
return "hello world";
},
};
JSON.stringify(obj);
// "hello world"const obj = {
name: "loopObj",
};
const loopObj = {
obj,
};
// 对象之间形成循环引用，形成闭环
obj.loopObj = loopObj;
JSON.stringify(obj);
//TypeError: Converting circular structure to JSON. 对包含循环引用的对象（对象之间相互引用，形成无限循环）执行此方法，会抛出错误。
const obj = {
a: "aaa",
[Symbol("foo")]: "foo",
};
JSON.stringify(obj);
// {"a":"aaa"}
JSON.stringify(obj, function (k, v) {
if (typeof k === "symbol") {
return "a symbol";
}
});
// undefinedJSON.stringify({
date: new Date("2022-02-02"),
})
// {"date":"2022-02-02T00:00:00.000Z"}JSON.stringify([NaN, Infinity, 1 / 0, Number("a")]);
// [null,null,null,null]// 不可枚举的属性默认会被忽略：
JSON.stringify(
Object.create(null, {
x: { value: "x", enumerable: false },
y: { value: "y", enumerable: true },
})
);
// "{"y":"y"}"localStorage 中的键值对总是以字符串的形式存储，所以当我们需要把一个对象存在 localStorage 中时，只能用 JSON.stringify 将其转化成字符串存储，使用的时候用 JSON.parse 方法去取
const userInfo = { user: "admin" };
localStorage.setItem("userInfo", JSON.stringify(userInfo));
JSON.parse(localStorage.getItem("userInfo"));
// {user: 'admin'}使用 JSON.parse(JSON.stringify) 是实现对象的深拷贝最简单粗暴的方法。但是由于 JSON.stringify 的一些特性，会产生问题，例如：
undefined、Symbol、 函数， 对象中会被忽略，数组中会被序列化成 null。
NaN、Infinity 和 -Infinity 会被序列化成 null。
循环引用问题，stringify 会报错。
当确定不存在以上情况时，才考虑使用 JSON.parse(JSON.stringify) 进行深拷贝。
当接口返回一大堆数据，我们只想存某几个属性的时候，通过 replacer 函数过滤属性是一个不错的小技巧。
var foo = {
id: 1,
name: "sf",
age: 18,
};
localStorage.setItem("user", JSON.stringify(foo, ["id", "name"]));
localStorage.getItem("user");
//{"id":1,"name":"sf"}到此，相信大家对“JSON.stringify如何运用”有了更深的了解，不妨来实际操作一番吧！这里是亿速云网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！
亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
