暂无图片
暂无图片
暂无图片
暂无图片
暂无图片

JSON的Stringify及深浅拷贝

原创 浮游 2022-09-19
645

Stringify的参数replace、space

JSON.stringify() 方法将一个 JavaScript 对象或值转换为 JSON 字符串:

  • 如果第二个参数指定了一个 replacer 函数,则可以选择性地替换值;
  • 如果第二个参数指定的 replacer 是数组,则可选择性地仅包含数组指定的属性;

它还可以跟上第三个参数space:

const obj = { name: "why", age: 18, friends: { name: "kobe" }, hobbies: ["篮球", "足球"], // toJSON: function() { // return "123456" // } } // 需求: 将上面的对象转成JSON字符串 // 1.直接转化 const jsonString1 = JSON.stringify(obj) console.log(jsonString1) // 2.stringify第二个参数replacer // 2.1. 传入数组: 设定哪些是需要转换 const jsonString2 = JSON.stringify(obj, ["name", "friends"]) console.log(jsonString2) // 2.2. 传入回调函数: const jsonString3 = JSON.stringify(obj, (key, value) => { if (key === "age") { return value + 1 } return value }) console.log(jsonString3) // 3.stringify第三参数 space const jsonString4 = JSON.stringify(obj, null, "---") console.log(jsonString4)

image.png

parse方法

JSON.parse() 方法用来解析JSON字符串,构造由字符串描述的JavaScript值或对象。

提供可选的 reviver 函数用以在返回之前对所得到的对象执行变换(操作)。

const JSONString = '{"name":"why","age":19,"friends":{"name":"kobe"},"hobbies":["篮球","足球"]}' const info = JSON.parse(JSONString, (key, value) => { if (key === "age") { return value - 1 } return value }) console.log(info)

使用JSON序列化深拷贝

另外我们生成的新对象和之前的对象并不是同一个对象:

相当于是进行了一次深拷贝;

const obj = { name: "why", age: 18, friends: { name: "kobe" }, hobbies: ["篮球", "足球"], foo: function() { console.log("foo function") } } // 将obj对象的内容放到info变量中 // 1.引用赋值 const info = obj obj.age = 100 console.log(info.age) // 2.浅拷贝 const info2 = { ...obj } obj.age = 1000 console.log(info2.age) obj.friends.name = "james" console.log(info2.friends.name) // 3.stringify和parse来实现 const jsonString = JSON.stringify(obj) console.log(jsonString) const info3 = JSON.parse(jsonString) obj.friends.name = "curry" console.log(info3.friends.name) console.log(info3)
「喜欢这篇文章,您的关注和赞赏是给作者最好的鼓励」
关注作者
【版权声明】本文为墨天轮用户原创内容,转载时必须标注文章的来源(墨天轮),文章链接,文章作者等基本信息,否则作者和墨天轮有权追究责任。如果您发现墨天轮中有涉嫌抄袭或者侵权的内容,欢迎发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。

评论