JSON.parse 和 JSON.stringify 详解

JSON格式,(简写JavaScript Object Notation),是一种用于数据交换的文本格式,书写简单。
基于JavaScript原生语法,能够序列化对象、数组、数值、字符串、布尔值 null。

在ES5中,增加了一个JSON对象,专门用来处理JSON格式的数据。
JSON是一个对象,但只有两个方法:parse stringify,不能作为构造函数,也无属性。

typeof JSON === \'object\' JSON.parse

JSON.parse() 用来解析JSON字符串,得到对应的JavaScript值或对象。

JSON.parse(\'{}\') // {} JSON.parse(\'true\') // true JSON.parse(\'null\') // null JSON.parse 语法 JSON.parse(text[, reviver])

text:要被解析成的字符串。
如果传入数字则会转换成十进制数字输出。
如果传入布尔值则直接输出。
如果传入null则输出null。
不支持其他类型的值,否则报错。

reviver: 可选,转换器, 可以用来修改解析生成的原始值。

返回值: JavaScript对象/值, 对应给定JSON文本的对象/值。

reviver 参数

reviver函数,用于转换处理解析到的JavaScript值,处理完后返回最终的结果。

转换过程:

解析的值本身和它可能包含的所有属性,按照一定遍历顺序分别调用reviver函数,属性名和值作为参数两个参数 key 和 value 传入。
遍历顺序:按照层级,从内往外遍历,最终到达最顶层,则是解析值本身。

reviver返回undefined,则删除该对象,如果返回了其他值,则该值会成为当前属性的新值。

当遍历到最顶层时,因为没有属性了,参数key是空字符串\'\',参数value则是当前解析值。

对于reviver函数的两个参数 key 和 value,不同的数据类型:

基本值类型数据(string、number、boolean)和null,以及空对象{}和空数组[]:
则key是空字符串,value是对应解析值。
因为已经是最顶层,并没有别的属性。

Object对象:
则key和value都存在,与属性名和值各自对应。
最顶层会返回一个参数key为空的值。

数组:
key对应数组索引,value对应元素值。
最顶层会返回一个参数key为空的值。

基本类型的转换:

JSON.parse(\'5\', function (key, value) { console.log(`key:${key}, value:${value}`) }) // key:, value:5 JSON.parse(\'null\', function (key, value) { console.log(`key:${key}, value:${value}`) }) // key:, value:null JSON.parse(\'{}\', function (key, value) { console.log(`key:${key}, value:`, value) }) // key:, value:{}

Object对象和数组:

JSON.parse(\'[1, 2]\', function (key, value) { console.log(`key:${key}, value:`, value) }) // key:0, value: 1 // key:1, value: 2 // key:, value: (2) [empty × 2] JSON.parse(\'{ "user": "张三", "info": { "age": 25, "sex": 1 } }\', function (key, value) { console.log(`key:${key}, value::`, value) }) // key:user, value:: 张三 // key:age, value:: 25 // key:sex, value:: 1 // key:info, value:: {} // key:, value:: {}

数据处理:

JSON.parse(\'[1, 2]\', function (key, value) { if(key === \'\') { return value } return value + 3 }) // [4, 5] JSON.parse 特性

在解析JSON字符串的时候,需要注意到JSON格式的一些规范,不然就容易报错。
JSON数据对值的类型和格式,都有严格的规定,具体的规则如下:

该方法使用字符串类型JSON格式数据。
该方法也支持数字、布尔值和null三个类型的值,转换出对应的字面值。
不支持其他类型。

JSON.parse(\'"中国"\') // \'中国\' JSON.parse(null) // null JSON.parse(111.) // 111 JSON.parse(0x12) // 18 JSON.parse(true) // true JSON.parse([]) // Uncaught SyntaxError: Unexpected end of JSON input

字符串必须使用双引号,不能使用单引号。

JSON.parse(\'"String"\') // \'String\' JSON.parse(\'\\'String\\'\') // Uncaught SyntaxError: Unexpected token \' in JSON at position 0

只支持十进制的字符串,但小数点后必须跟上数字。

JSON.parse(\'111\') // 111 JSON.parse(\'0x12\') // Uncaught SyntaxError: Unexpected token x in JSON at position 1 JSON.parse(\'111.232\') // 111.232 JSON.parse(\'111.\') // Uncaught SyntaxError: Unexpected end of JSON input

不能使用undefined、Symbol和BigInt,数字也不支持NaN、Infinity和-Infinity,都会报错。

JSON.parse(undefined) // Uncaught SyntaxError: Unexpected token u in JSON at position 0 JSON.parse(Symbol()) // Uncaught TypeError: Cannot convert a Symbol value to a string JSON.parse(\'12n\') // Uncaught SyntaxError: Unexpected token n in JSON at position 2

复合类型,只能是:[] 和 {} 这样的字面量。
不能使用对象构造函数,因为会当作执行语句,不支持。
不能使用Object和Array,也不能是函数、RegExp对象、Date对象、Error对象等。

JSON.parse(\'[]\') // [] JSON.parse(\'Object()\') // Uncaught SyntaxError: Unexpected token O in JSON at position 0

对象的属性名必须使用双引号。

JSON.parse(\'{"key": 1 }\') // {key: 1} JSON.parse(\'{key: 1 }\') // Uncaught SyntaxError: Unexpected token k in JSON at position 1

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zgywyp.html