📋 介绍 ★
JSON.stringify() 是 JavaScript 的内置方法,用于将 JavaScript 值** 对象/数组/值 转换为 JSON 字符串**。
🎯 核心作用 ★★
将 JavaScript 对象/数组/值转换为 JSON 字符串格式。
📝 基本语法 ★
JSON.stringify(值, 替换函数, 缩进空格数)
💡 经典示例 ★
const obj = { name: '张三', age: 25, city: '北京' }
const jsonString = JSON.stringify(obj)
console.log(jsonString)
// 输出: '{"name":"张三","age":25,"city":"北京"}'
🔧 实际应用场景
1. 发送 AJAX 请求
// 发送数据到服务器
const data = { username: '张三', password: '123456' }
const jsonData = JSON.stringify(data)
fetch('/api/login', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: jsonData // 必须是字符串
})
2. 本地存储
// 保存到 localStorage
const user = { id: 1, name: '张三' }
localStorage.setItem('user', JSON.stringify(user))
// 读取
const stored = localStorage.getItem('user')
const userObj = JSON.parse(stored)
3. 深拷贝简单对象
// 简单对象的深拷贝
const obj = { a: 1, b: { c: 2 } }
const copy = JSON.parse(JSON.stringify(obj))
console.log(copy) // 独立的对象
⚡ 主要特点
优点
✅ 简单易用:一行代码转换
✅ 标准格式:生成标准 JSON
✅ 广泛支持:所有现代浏览器支持
注意事项
⚠️ 忽略函数:函数会被忽略
⚠️ 忽略 undefined:undefined 会被忽略
⚠️ 忽略 symbol:Symbol 会被忽略
⚠️ 日期变字符串:Date 变为 ISO 字符串
⚠️ 循环引用报错:对象循环引用会报错
🔄 参数详解
1. 替换函数
const obj = { a: 1, b: 2, c: 3 }
// 只包含某些属性
const result = JSON.stringify(obj, ['a', 'b'])
// '{"a":1,"b":2}'
// 自定义转换
const result2 = JSON.stringify(obj, (key, value) => {
if (key === 'b') return undefined // 排除 b
return value
})
// '{"a":1,"c":3}'
2. 缩进空格
const obj = { name: '张三', age: 25 }
// 美化输出
const pretty = JSON.stringify(obj, null, 2)
/*
{
"name": "张三",
"age": 25
}
*/
// 使用制表符
const tabbed = JSON.stringify(obj, null, '\t')
📈 常见陷阱
1. 循环引用
const obj = { name: 'test' }
obj.self = obj // 循环引用
// ❌ 会报错
// JSON.stringify(obj) // TypeError
2. 日期处理
const obj = { date: new Date() }
const json = JSON.stringify(obj)
// '{"date":"2024-01-20T10:30:00.000Z"}'
// 需要手动转换回来
const parsed = JSON.parse(json, (key, value) => {
if (key === 'date') return new Date(value)
return value
})
3. BigInt 报错
const obj = { id: 12345678901234567890n } // BigInt
// ❌ 会报错
// JSON.stringify(obj) // TypeError
🎓 记住这几点
- 转为字符串:对象 → JSON 字符串
- 忽略函数:函数、undefined、Symbol 被忽略
- 可格式化:支持缩进美化输出
- 可过滤:支持替换函数过滤字段
- 常用场景:网络传输、本地存储、深拷贝
📋 总结
JSON.stringify 是 JavaScript 中对象序列化的标准方法,用于将 JavaScript 值转换为 JSON 字符串,是前后端数据交互的基础工具。
