JSON.stringify() 的奥秘：理解转换过程和选项 (json.stringify)

JSON.stringify() 是 javascript 中一个有用的函数，用于将 JavaScript 对象转换为 JSON 字符串。它是一种将数据从 JavaScript 应用程序传输到后端或在客户端存储数据的常用方式。

转换过程

当 JSON.stringify() 被调用时，它会通过以下步骤将 JavaScript 对象转换为 JSON 字符串：1. 确定可序列化的值：检查对象中每个属性的类型。只有可序列化的值才能转换为 JSON，包括：- 字符串- 数字- 布尔

示例

以下是一些使用不同选项的 JSON.stringify() 示例： javascript // 默认转换 const obj = {name: "John", age: 30}; const jsonString = JSON.stringify(obj); console.log(jsonString); // {"name":"John","age":30}// 使用 replacer 选项 const replacer = (KEY, value) => {if (key === "age") {return value + 1;}return value; }; const jsonString2 = JSON.stringify(obj, replacer); console.log(jsonString2); // {"name":"John","age":31}// 使用 space 选项 const jsonString3 = JSON.stringify(obj, null, 2); console.log(jsonString3); // {"name": "John",// "age": 30}// 使用 timeout 选项 const timeout = 1000; try {const jsonString4 = JSON.stringify(obj, null, 0, timeout);console.log(jsonString4); } catch (err) {console.log(err); // 循环遍历时间限制已超时 }

结论

JSON.stringify() 是一个强大的函数，用于将 JavaScript 对象转换为 JSON 字符串。了解其转换过程和选项对于有效地使用它至关重要。通过指定不同的选项，您可以定制转换行为并满足特定要求。

---

深入理解JSON.stringify()

在实际开发中有着丰富的应用场景，尽管你可能已经熟悉了它的基本用法，但其实它隐藏着更多实用特性。 这些特性往往在不经意间发挥作用，值得深入理解。 如果你觉得这个话题略显枯燥，让我们通过几个有趣的场景来探索。 例如，深拷贝时，的deepCopy功能（如`((obj/arr))`）在处理引用类型数据时至关重要，它能确保新生成的对象与原对象在内存上独立，互不影响。 在服务端数据存储中，也十分关键。 比如，存储的canvas模板数据和Vue-amap的SVG路径信息，这时就需要序列化存储。 另外，localStorage和sessionStorage存储的数据必须先转化为字符串，否则可能出现存储失效的问题。 当从服务端接口获取Canvas或SVG数据时，能帮助解析这些数据，并在和vue-amap等组件中正确渲染。 此外，还能过滤数据和格式化输出，包括设置缩进，使其更易于阅读。 不过，遇到自引用对象时，会抛出“cyclic object value”错误，这时需要特殊处理，比如使用库。 对于具有相同属性但顺序不同的对象，的结果可能出乎意料，这需要额外注意。 在实际操作中，可能会遇到诸如数据库存储后属性消失、axios请求参数undefined消失等问题，这可能是由于replacer函数的过滤、属性设置或数据类型的特殊性导致的。 与localStorage的配合使用时，确保数据为字符串是关键。 通过上述内容，你应该对有了更深入的认识。 在遇到问题时，记得检查replacer、对象属性和数据类型，找出问题的根源。 加入我们的技术讨论小组，一起交流学习，提升前端开发技能吧！

一文彻底弄懂JSON.parse()与JSON.stringify()

深入理解 () 和 () 的功能和用法，对于对象与JSON字符串的交互至关重要。 这两个方法在转换和序列化过程中起着核心作用。

(): 从JSON字符串到对象

() 是将JSON字符串解析为JavaScript对象的关键工具。 最常见的用法是将字符串转换为包含数据的对象。 然而，在特殊情况下，如计算员工高温费，可通过reviver函数实现属性过滤或删除。 需要注意的是，如果输入的JSON格式有误，它会抛出SyntaxError异常。

(): 从对象到JSON字符串

与之相对，() 负责将JavaScript对象转换为JSON字符串。 使用时，可以指定特定属性进行序列化，或者处理数组和非数组对象的转换规则。 遇到循环引用或BigInt类型时，会引发TypeError异常。 MDN文档提供了详细的行为规范，包括值的序列化规则和异常处理。

其他应用场景

关于JSON.stringify的妙用

我们都知道JSON对象有两个方法，一个是parse，用来把json字符串转换为json对象，另一个是stringify，用来把json对象转换为json字符串， 可是stringify其实还有其它作用。 比如说有一个对象 {a:1,b:2,c:3,d:4,e:5} ,现在我们只需要b属性和e属性，可以这样来操作

(value, replacer , space) 语法

将要序列化成 一个JSON 字符串的值。

如果该参数是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；如果该参数是一个数组，则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中；如果该参数为null或者未提供，则对象所有的属性都会被序列化。

指定缩进用的空白字符串，用于美化输出（pretty-print）；如果参数是个数字，它代表有多少的空格；上限为10。 该值若小于1，则意味着没有空格；如果该参数为字符串(字符串的前十个字母)，该字符串将被作为空格；如果该参数没有提供（或者为null）将没有空格。

JSON.stringify详解

当我们使用 () 序列化一个值为JSON字符串，只有 JSON安全的值 才可以通过 ()转换为字符串。 那么，什么是 JSON安全的值 ？能够有效用JSON形式表示的任何值。

非JSON安全的值，例如： undefined 、 function 和 symbol 以及循环引用的object（对象结构的属性引用通过创建彼此，构成一个无限循环）。 对一个标准的JSON结构来说，这些值都是非法的，主要是因为它们无法移值到其他支持JSON的语言中。

当 () 遇到 undefined 、 function 和 symbol 的时候，会自动忽略它们的值，如果这样的值在数组中会被替换成 null （这样数组的索引信息就不会被改变）。 如果这样的值出现在对象的属性中，那这个属性会被排除掉。

JSON字符串有一个特殊的行为，如果一个对象定义了 toJSON() 方法，那这个方法先被调用，并且将它返回的值进行序列化。

如果将一个含有非法JSON值的对象序列化成JSON字符串，需要定义一个 toJSON() 方法，用于返回该对象的JSON安全版本。

()第二个参数是个可选参数，被称为replacer。 这个参数可以是数组或者函数。 它提供了一个过滤机制制定了应该或者不应该包含哪些属性，从而实现了对象可定制的递归序列化，这种做法和toJSON()如何序列化准备一个值很相似。

如果replacer是一个数组，它应该是一个字符串数组，每一个值都指定了对象的属性名称，代表属性应该被加入到序列化中，如果一个属性不在这个列表中，它会被跳过。

如果replacer是一个函数，它首先会被该对象调用一次，然后该对象的每个属性会调用一次，每次都会给这个函数传递两个值，key和value。 想在序列化过程中跳过某个key，只需要返回undefined，否则返回提供的value。

第三个可选的参数也可以传递给()，被称为space，被用作缩进，是为了使得输出有格式更加漂亮。 space可以是一个正整数，指定每层缩进应该缩进多少个空格。 或者space也可以是个字符串，其值的前十个字符被用于每个缩进层次。

JSON. stringify()的问题？

后台输出的是[object Object]，看不到具体的内容，此时只需在前端页面上利用()将该传输数据转换成与json文件中格式一致就可以解决问题。

代码如下：

(date) //data

注() 方法是将一个JavaScript值(对象或者数组)转换为一个 JSON字符串。

扩展资料：

[object Object]进一步获得值的方法：

1、对象中有数组，数组中有对象的情况

data={total:3,rows:[{name:老四,},{name:老六,电

提取“老四”： var da=[0];

2、对象中有数组的情况

data={rows:[2,4,5,6,8]}

提取数组：var da=;或者 var da=data[rows];

---

---

相关标签： 的奥秘、 理解转换过程和选项、 JSON.stringify、 json.stringify、

上一篇：JSONstringify最佳实践避免常见陷阱和优化

下一篇：JSONstringify实用指南高效转换JavaScript