JS中的JSON.Stringify 方法详解
封面图
•
2025-11-02
•
JavaScript
189
0
0
0
在 JavaScript 中,`JSON.stringify()` 是一个非常常用的方法,用于将 JavaScript 对象或值转换为 JSON 字符串。它广泛用于数据序列化、网络传输、存储等场景。 --- ## ✅ 一、基本语法 ```javascript JSON.stringify(value[, replacer[, space]]) ``` ### 参数说明: | 参数 | 类型 | 说明 | |----------|------------------|----------------------------------------------------------------------| | `value` | any | 要转换成 JSON 字符串的值(对象、数组、字符串、数字等)。 | | `replacer` | function 或 array | 可选参数,用于过滤或转换结果。可以是函数,也可以是字符串数组。 | | `space` | number 或 string | 可选参数,用于控制缩进格式。可以是数字(表示空格数)或字符串(如 `" "`)。 | --- ## ✅ 二、基本使用示例 ### 示例 1:简单对象 ```javascript const obj = { name: "Alice", age: 30 }; const str = JSON.stringify(obj); console.log(str); // 输出: {"name":"Alice","age":30} ``` ### 示例 2:数组 ```javascript const arr = [1, 2, 3]; const str = JSON.stringify(arr); console.log(str); // 输出: [1,2,3] ``` ### 示例 3:嵌套对象 ```javascript const data = { user: { name: "Bob", age: 25 }, hobbies: ["reading", "gaming"] }; const str = JSON.stringify(data); console.log(str); // 输出: {"user":{"name":"Bob","age":25},"hobbies":["reading","gaming"]} ``` --- ## ✅ 三、`replacer` 参数详解 ### 1. 使用函数作为 `replacer` ```javascript const obj = { name: "Alice", age: 30, secret: "123456" }; const str = JSON.stringify(obj, (key, value) => { if (key === 'secret') return undefined; // 过滤掉 secret 属性 return value; }); console.log(str); // 输出: {"name":"Alice","age":30} ``` ### 2. 使用数组指定要保留的属性 ```javascript const obj = { name: "Alice", age: 30, secret: "123456" }; const str = JSON.stringify(obj, ['name', 'age']); console.log(str); // 输出: {"name":"Alice","age":30} ``` --- ## ✅ 四、`space` 参数详解 用于控制输出的格式,使 JSON 字符串更易读。 ### 示例: ```javascript const obj = { a: 1, b: 2 }; // 没有缩进 console.log(JSON.stringify(obj)); // {"a":1,"b":2} // 使用数字表示空格数 console.log(JSON.stringify(obj, null, 2)); // 输出: // { // "a": 1, // "b": 2 // } // 使用字符串(例如制表符) console.log(JSON.stringify(obj, null, '\t')); // 输出: // { // "a": 1, // "b": 2 // } ``` --- ## ✅ 五、注意事项与限制 ### 1. **不支持函数和 Symbol 类型** ```javascript const obj = { name: "Alice", func: function() { return "Hello"; }, sym: Symbol("test") }; console.log(JSON.stringify(obj)); // 输出: {"name":"Alice"} // func 和 sym 被忽略 ``` ### 2. **循环引用会抛出错误** ```javascript const obj = {}; obj.self = obj; JSON.stringify(obj); // 报错:Uncaught TypeError: Converting circular structure to JSON ``` ### 3. **undefined、函数、Symbol 会被忽略** ```javascript const obj = { a: undefined, b: function() {}, c: Symbol('test') }; console.log(JSON.stringify(obj)); // 输出: {} ``` --- ## ✅ 六、常见用途 - 数据传输(如发送到后端 API) - 存储数据(如 localStorage) - 序列化对象用于日志记录 - 转换复杂结构为字符串进行比较或缓存 --- ## ✅ 七、总结 | 特性 | 描述 | |--------------|----------------------------------------------------------------------| | 功能 | 将 JS 值转为 JSON 字符串 | | 支持类型 | 对象、数组、数字、字符串、布尔、null 等 | | 不支持类型 | 函数、undefined、Symbol、循环引用 | | 可选参数 | `replacer`(过滤/转换)、`space`(格式化) | --- 如果你有任何具体问题,比如如何处理特殊对象、如何避免循环引用、或者想了解 `JSON.parse()` 的对比,欢迎继续提问!
上一篇:
JS获取四位年份和2位年份
下一篇:
JavaScript如何截取字符串的最后一位?
标题录入,一次不能超过6条
留言
评论