JSON.stringify()
- JSON.stringify() 方法用于将一个JavaScript对象或值转换为JSON字符串。这个方法可以接受三个参数：
- value：将要被转换成JSON字符串的JavaScript对象、数组或值。
- funcation或arr：如果这个参数是一个函数，那么每个成员都会调用这个函数进行处理；如果是一个数组，那么只有包含在这个数组中的属性名会被包含在最终的JSON字符串中。
- space：用于美化输出的空格数量。
- 示例：
const obj = { name: 'mmm', age: 18, others: ['1', '2'], } console.log(typeof obj) function str(key, value) { if (key === 'age') { return 28 } if (Array.isArray(value)) { return [] } return value } const b = JSON.stringify(obj) const c = JSON.stringify(obj, str, 2) const d = JSON.stringify(obj, ['name'], 4) console.log(b) console.log(c) console.log(d) console.log(typeof b) - 使用场景
- 场景1：webstoreage存储对象
- 如果通过setItem直接存储对象，那么通过getItem读取的值是’[Object …]’
- 如果先通过JSON.stringify()把对象转成字符串，在存储对象，则读取的值就是字符串化后的对象。可以通过JSON.parse()还原成对象
- 场景2：对象的深拷贝
- 为什么要深拷贝？
- js中的对象都是引用类型，比如，定义一个a={x:1},然后在定义一个b=a,如果在操作b.x =2, 那么a.x的值也会被修改为2。
- 为什么呢？这涉及到栈内存与堆内存
- 栈内存：自动分配内存，系统会自动释放，存放基本类型值和指向堆内存的引用（指针）。
- 堆内存：动态分配内存，存储复杂对象，大小不定，不会自动释放。
- 当我们定义一个a={x:1}时，a实际上是的值是堆内存的对象的存放地址，a的值会被放在栈内存中。那么在操作b=a时，实际上是把对象的存放地址赋值给b了，这个时候a和b的堆内存地址是一样的，也就是a和b都指向了堆内存中的同一个对象，那么在修改b的时候，修改了堆内存的值，那么a也是指向的这个堆。因此a的值也在变化。在实际开发过程中，我们希望修改b，而不改变a。那么就将a先序列化成字符串，这样a的值就是常量字符串，存放在栈中了，在赋值给b的时候，这个时候就是完全复制了，会把栈中b的值改成字符串的值，然后再通过JSON.parse()把字符串解析成对象赋值给b。这个时候堆内存中就有两个一模一样的对象，但地址不一样，也就是a的堆内存引用地址和b的堆内存引用地址不一样了，那么在修改b就不会影响a了。
- 错误的用法：
const a = { x: 1 } const b = a b.x = 2 console.log(b) console.log(a) - 正确的用法：
const a = { x: 1 } const b = JSON.parse(JSON.stringify(a)) b.x = 2 console.log(b) console.log(a)
JSON.parse()
- JSON.parse() 方法用于将JSON字符串解析成JavaScript对象或值。这个方法可以接受两个参数：
- JSON字符串：将要被解析成JavaScript对象的JSON字符串。
- 函数：如果这个参数是一个函数，它会对解析出的每个值进行处理。函数的使用方法和stringify的函数使用方法一样。
