详解JSON.parse和JSON.stringify用法

json格式，(简写javascript object notation)，是一种用于数据交换的文本格式，书写简单。

基于javascript原生语法，能够序列化对象、数组、数值、字符串、布尔值和 null。

在es5中，增加了一个json对象，专门用来处理json格式的数据。

json是一个对象，但只大学生活英语有两个方法：par和stringify，不能作为构造函数，也无属性。

typeof json === 'object'

json.par

json.par()用来解析json字符串，得到对应的javascript值或对象。

json.par('{}') // {}json.par('true') // truejson.par('null') // null

json.par 语法

json.par(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.par('5', function (key, value) {  console.log(`key:${key}, value:${value}`)})// key:, value:5json.par('null', function (key, value) {  console.log(`key:${key}, value:${value}`)})// key:, value:nulljson.par('{}', function (key, value) {  console.log(`key:${key}, value:`, value)})// key:, value:{}

object对象和数组：

json.par('[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.par('{ "ur": "张三", "info": { "age": 25, "x": 1 } }', function (key, value) {  console.log(`key:${key}, value::`, value)})// key:ur, value:: 张三// key:age, value:: 25// key:x, value:: 1// key:info, value:: {}// key:, value:: {}

数据处理：

json.par('[1, 2]', function (key, value) {  if(key === '') {    return value  }  return value + 3})// [4, 5]

json.par 特性

在解析json字符串的时候，需要注意到json格式的一些规范，不然就容易报错。

json数据对值的类型和格式，都有严格的规定，具体的规则如下：

该方法使用字符串类型json格式数据。清晨与黄昏

该方法也支持数字、布尔值和null三个类型的值，转换出对应的字面值。

不支持其他类型。

json.par('"中国"')// '中国'json.par(null) // nulljson.par(111.) // 111json.par(0x12) // 18json.par(true) // truejson.par([])// uncaught syntaxerror: unexpected end of json input

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

json.par('"string"')// 'string'json.par('\'string\'')// uncaught syntaxerror: unexpected token ' in json at position 0

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

json.par('111') // 111json.par('0x12')// uncaught syntaxerror: unexpected token x in json at position 1json.par('111.232') // 111.232json.par('111.')// uncaught syntaxerror: unexpected end of json input

不能使用undefined、symbol和bigint，数字也不支持nan、infinity和-infinity，都会报错。

json.par(undefined)// uncaught syntaxerror: unexpected token u in json at position 0json.par(symbol())// uncaught typeerror: cannot convert a symbol value to a stringjson.par('12n')// uncaught syntaxerror: unexpected token n in json at position 2

复合类型，只能是：[]和{}这样的字面量。

不能使用对象构造函数，因为会当作执行语句，不支持。

不能使用object和array，也不能是函数、regexp对象、date对象、error对象等。

json.par('[]')// []json.par('object()')// uncaught syntaxerror: unexpected token o in json at position 0

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

json.par('{"key": 1 }')// {key: 1}json.par('{key: 1 }')// uncaught syntaxerror: unexpected token k in json at position 1

数组或对象最后一个成员的后面，不能加逗号。

json.par('[1, 2, 3, 4, ]')// vm2771:1 uncaught syntaxerror: unexpected token ] in json at position 13json.par('{"key" : 1, }')// vm2779:1 uncaught syntaxerror: unexpected token } in json at position 12

支持unicode转义。

json.par('{"\u0066":333}')// {f: 333}

部分控制字符、转义字符不支持，如’\n’、’\t’等。

json.par('"\n"')// uncaught syntaxerror: unexpected token 

解析的其他方法

将json字符串转成json对象(js对象值)，还可以使用其他方法，但是非安全代码。

  const str = '{"name":"json","age":18}'  const json = json.par(str)  const json = eval("(" + str + ")")  const json = (new function("return " + str))()

json.stringify

json.stringify()将一个javascript对象或值转换为json格式字符串。

json.stringify 语法

json.stringify(value[, replacer [, space]])

value：将要序列化成 一个 json 字符串的javascript对象或值。replacer 可选，用于处理将要序列化的值。space 可选，指定缩进用的空白字符串，用于美化输出。

返回值：一个表示给定值的json格式字符串。

replacer参数

replacer 参数可以以下三种情况：

如果是null、unde庖丁解牛原文fined或其他类型，则被忽略，不做处理；

json.stringify({key: 'json'}, null, null) // '{"key":"json"}'json.stringify({key: 'json'}, true) // '{"key":"json"}'

如果是一个数组，则只有包含在这个数组中的属性名，才会最终被序列化到结果字符串中；

只对对象的属性有效，对数组无效。

const obj = {  json: 'json',  par: 'par',  stringify: 'stringify'}json.stringify(obj, ['par', 'stringify'])// '{"par":"par","stringify":"stringify"}'

如果是一个函数，被序列化的值的每个属性都会经过该函数的转换和处理；

处理过程：

函数有两个参数，属性名(key)和属性值(value)，都会被序列化；第一次调用时，key为空字符串，value则为需要序列化的整个对象；第二次处理时，会把第一次的的结果传过来，后续的每一次的处理都将接收上一次处理的结果；后面，将依次处理每个属性名和属性值，完成后返回。

json.stringify({ json: 1, stringify: { val: 'rr'} }, (key, value) => {  console.log(`key：${key}，value：`, value)  return value}) // key：，value： {json: 1, stringify: {…}}// key：json，value： 1// key：stringify，value： {val: 'rr'}// key：val，value： rr// '{"json":1,"stringify":{"val":"rr"}}'

value的类型处理：

如果返回基本类型字符串、数字、布尔值、null，则直接被添加到序列化后的json字符串中；如果返回其他对象，则会在后续依次序列化该对象的属性，如果是函数则不作处理；如果返回或undefined，则不会输出该属性。序列化数组时，如果value返回undefined或者一个函数，将会被null取代。

json.stringify({ json: 1, stringify: 'rr' }, (key, value) => {  if (typeof value === 'number') {    return 'ss'  }  return value}) // '{"json":"ss","stringify":"rr"}'json.stringify({ json: 1, stringify: 'rr' }, (key, value) => {  if (typeof value === 'number') {    value = undefined  }  return value}) // '{"stringify":"rr"}'

下面示例，是返回对象值时的处理：

json.stringify({ json: 1, stringify: 'rr' }, (key, value) => {  if (typeof value === 'object') { // 第一次返回整个对象时，类型是object    return { par: 'dd' }  }  return value}) '{"par":"dd"}'

space 参数

space 参数用来控制结果字符串里面的间距，美化输出。可以输入的值有以下三种情况：

如果是一个数字, 序列化时，每一层级比上一层级多缩进对应数字值的空格，范围在 1 – 10，即最小1个最大10个空格；如果是一个字符串，序列化时，该字符串会添加在每行前面，每一层级比上一层级多缩进该字符串，最多是个字符，超过则截取字符串；如果是null、undefined或其他类型，则被忽略，不做处理。

json.stringify({key: 'json'}, null, 2)// '{\n  "key": "json"\n}'json.stringify({key: 'json', list: { str: 'str' } }, null, '|-')// '{\n|-"key": "json",\n|-"list": {\n|-|-"str": "str"\n|-}\n}'json.stringify({key: 'json'}, null, null)// '{"key":"json"}'

json.stringify 特性

基本类型值字符串、数字、布尔值，以及string、boolean、number对象值，都会转成原始值字符串输出。

json.stringify(333) // '333'json.stringify(true) // 'true'json.stringify(new str好听的微信昵称男ing('333')) //'"333"'json.stringify(boolean(true)) // 'true'

基本类型的字符串，转换结果会带双引号。

因为在还原时，双引号会让javascript知道是字符串，而不是变量。

json.stringify('json') === 'json' // faljson.stringify('json') === '"json"' // true

undefined、函数、symbol以及xml对象：出现在object对象中时，会被忽略；出现在数组中时，会被序列化成null；单独出现时，会返回undefined。

json.stringify(symbol()) // undefinedjson.stringify([symbol(), math.abs, undefined]) // '[null,null,null]'json.stringify({ [symbol()]: math.abs, key: undefined }) // '{}'

nan、infinity和-infinity等值，还有null，都会被序列化成null。

json.stringify(null) // 'null'json.stringify(nan) // 'null'

object对象，以及map/t/weakmap/weakt等复合类型对象，序列化时会忽略对象的不可遍历属性。

const obj = {}object.defineproperties(obj, {  'json': { value: 'json', enumerable: true },  'stringify': { value: 'stringify', enumerable: fal }})json.stringify(obj)// '{"json":"json"}'

以symbol为属性名的属性将被忽略。

json.stringify({[symbol()]: 333}) // '{}'

除了数组，其他对象的属性在序列化时，顺序可能会乱。

const a = { '1': 911, 'r': 822, '11': 9922}json.stringify(a)// '{"1":911,"11":9922,"学游泳多少钱r":822}'

转换的对象如果定义了tojson()方法，则该方法的返回值就是转换对象的序列化结果。

该过程会忽略其他属性。

const a = { key: 'json' }a.tojson = () => 'json'json.stringify(a)// '"json"'

regexp对象、error对象都会序列化为空对象字符串。

json.stringify(/\d/) // "{}"json.stringify(new error())  // "{}"

想要序列化相应对象，需要设置实现tojson方法才行。

regexp.prototype.tojson = regexp.prototype.tostringjson.stringify(/\d/) // '"/\\\\d/"'

date对象已经定义了tojson()，并将其转换为string字符串，因此可被序列化。

同date.toisostring()。

json.stringify(new date())// '"2021-12-31t02:24:05.477z"'

循环引用的对象执行此方法，会抛出错误。

对象之间相互引用，形成无限循环。

const a = {}a.key = ajson.stringify(a)// uncaught typeerror: converting circular structure to json

转换bigint类型的值会抛出typeerror错误。

bigint值不能json序列化

json.stringify(12n)// uncaught typeerror: do not know how to rialize a bigint

更好的支持unicode转义符

const a = {'\u0066': 333}json.stringify(a)// '{"f":333}'

到此这篇关于详解json.par和json.stringify用法的文章就介绍到这了。希望对大家的学习有所帮助，也希望大家多多支持www.887551.com。