javascript中JSON.stringify如何使用


小编给大家分享一下javascript中JSON.stringify如何使用,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!在日常编程中,我们经常 JSON.stringify 方法将某个对象转换成 JSON 字符串形式。但 stringify 真的就这么简单吗?我们先来看一下 MDN 中对 stringify 的定义。MDN 中指出: JSON.stringify() 方法将一个 JavaScript 对象或值转换为 JSON 字符串,如果指定了一个 replacer 函数,则可以选择性地替换值,或者指定的 replacer 是数组,则可选择性地仅包含数组指定的属性。看完定义,小包就一惊,stringfy 不止一个参数吗?当然了,stringify 有三个参数。咱们来看一下 stringify 语法和参数介绍:value: 将要序列后成 JSON 字符串的值。replacer(可选)如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理;如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中如果该参数为 null 或者未提供,则对象所有的属性都会被序列化。space(可选): 指定缩进用的空白字符串,用于美化输出如果参数是个数字,它代表有多少的空格。上限为10。该值若小于1,则意味着没有空格如果该参数为字符串(当字符串长度超过10个字母,取其前10个字母),该字符串将被作为空格如果该参数没有提供(或者为 null),将没有空格我们来尝试一下 replacer 的使用。replacer 作为函数replacer 作为函数,它有两个参数,键(key) 和 值(value),并且两个参数都会被序列化。在开始时,replacer 函数会被传入一个空字符串作为 key 值,代表着要被 stringify 的这个对象。理解这点很重要,replacer 函数并非是上来就把对象解析成键值对形式,而是先传入了待序列化对象。随后每个对象或数组上的属性会被依次传入。 如果函数返回值为undefined或者函数时,该属性值会被过滤掉,其余按照返回规则。JSON 序列化结果为 {"week":45,"month":7}但如果序列化的是数组,若 replacer 函数返回 undefined 或者函数,当前值不会被忽略,而将会被 null 取代。JSON 序列化的结果为 ‘[1,null,3]’replacer 作为数组作为数组比较好理解,过滤数组中出现的键值。JSON 序列化结果为 {"week":45,"month":7}, 只保留 weekmonth 属性值。出现在非数组对象属性值中: undefined、任意函数、Symbol 值在序列化过程中将会被忽略出现在数组中: undefined、任意函数、Symbol值会被转化为 null单独转换时: 会返回 undefined转换值如果有 toJSON() 方法,toJSON() 方法返回什么值,序列化结果就返回什么值,其余值会被忽略。布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值特性四主要针对 JavaScript 里面的特殊值,例如 Number 类型里的 NaNInfinity 及 null 。此三种数值序列化过程中都会被当做 nullDate 对象上部署了 toJSON 方法(免费云主机域名Date.toISOString())将其转换为字符串,因此 JSON.stringify() 将会序列化 Date 的值为时间格式字符串。特性一提到,Symbol 类型当作值来使用时,对象、数组、单独使用分别会被忽略、转换为 null 、转化为 undefined。同样的,所有以 Symbol 为属性键的属性都会被完全忽略掉,即便 replacer 参数中强制指定包含了它们。通过上面案例,我们可以看出,虽然我们通过 replacer 强行指定了返回 Symbol 类型值,但最终还是会被忽略掉。JSON.stringify 规定: 尝试去转换 BigInt 类型的值会抛出 TypeError特性八指出: 对包含循环引用的对象(对象之间相互引用,形成无限循环)执行此方法,会抛出错误日常开发中深拷贝最简单暴力的方式就是使用 JSON.parse(JSON.stringify(obj)),但此方法下的深拷贝存在巨坑,关键问题就在于 stringify 无法处理循环引用问题。对于对象(包括 Map/Set/WeakMap/WeakSet)的序列化,除了上文讲到的一些情况,stringify 也明确规定,仅会序列化可枚举的属性localStorage 对象用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去删除。通常我们以对象形式进行存储。单纯调用 localStorage 对象方法localStorage 配合 JSON.stringify 方法来假设这样一个场景,后端返回了一个很长的对象,对象里面属性很多,而我们只需要其中几个属性,并且这几个属性我们要存储到 localStorage 中。方案一: 解构赋值+ stringify使用 stringifyreplacer 参数当 replacer 是数组时,可以简单的过滤出我们所需的属性,是一个不错的小技巧。使用 JSON.parse(JSON.stringify) 是实现对象的深拷贝最简单暴力的方法之一。但也正如标题所言,使用该种方法的深拷贝要深思熟虑。循环引用问题,stringify 会报错函数、undefinedSymbol 会被忽略NaNInfinity-Infinity 会被序列化成 null…因此在使用 JSON.parse(JSON.stringify) 做深拷贝时,一定要深思熟虑。如果没有上述隐患,JSON.parse(JSON.stringify) 是一个可行的深拷贝方案。在使用数组进行编程时,我们会经常使用到 map 函数。有了 replacer 参数后,我们就可以借助此参数,实现对象的 map 函数。很多同学有可能会很奇怪,为什么里面还需要多加一部判断,直接 return value * 2 不可吗?上文讲过,replacer 函数首先传入的是待序列化对象,对象 * 2 => NaN => toJSON(NaN) => undefined => 被忽略,就没有后续的键值对解析了。借助 replacer 函数,我们还可以删除对象的某些属性。JSON.stringify 可以将对象序列化为字符串,因此我们可以借助字符串的方法来实现简单的对象相等判断。借助上面的思想,我们还能实现简单的数组对象去重。但由于 JSON.stringify 序列化 {x:1, y:1}{y:1, x:1} 结果不同,因此在开始之前我们需要处理一下数组中的对象。方法一: 将数组中的每个对象的键按字典序排列但方法一有些繁琐,JSON.stringify 提供了 replacer 数组格式参数,可以过滤数组。方法二: 借助 replacer 数组格式看完了这篇文章,相信你对“javascript中JSON.stringify如何使用”有了一定的了解,如果想了解更多相关知识,欢迎关注百云主机行业资讯频道,感谢各位的阅读!

相关推荐: 微信小程序的基本运算符有哪些

这篇文章主要介绍“微信小免费云主机域名程序的基本运算符有哪些”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“微信小程序的基本运算符有哪些”文章能帮助大家解决问题。 示例代码: 加法运算(+)也可以用作字符串的拼接。 示例…

免责声明:本站发布的图片视频文字,以转载和分享为主,文章观点不代表本站立场,本站不承担相关法律责任;如果涉及侵权请联系邮箱:360163164@qq.com举报,并提供相关证据,经查实将立刻删除涉嫌侵权内容。

(0)
打赏 微信扫一扫 微信扫一扫
上一篇 01/14 18:48
下一篇 01/14 18:48

相关推荐