鲜为人知的 JSON.stringify 用法


本文摘自PHP中文网,作者青灯夜游,侵删。

JS 中有许多常见的函数,我们可能每天都在使用它们,但是却不知道它们的一些额外功能。JSON.stringify 就是这样的一个函数,今天就来看下它的特殊用法。

基础

JSON.stringify 方法接收一个变量,并将它转换成 JSON 表示形式。

1

2

3

4

5

6

7

const boy = {

  name: 'John',

  age: 23

};

 

JSON.stringify(boy);

// {"name":"John","age":23}

JSON 就是纯字符串,它本质上是 JS 的一个子集,所以并不是所有的 JS 对象都能转换为 JSON:

1

2

3

4

5

6

7

8

const boy = {

  name: 'John',

  age: 23,

  hobbies: new Map([[0, 'coding'], [1, 'earn money']])

}

 

JSON.stringify(boy)

// {"name":"John","age":23,"hobbies":{}}

上面的例子中 Map 对象就会被忽略并转换为普通对象。而如果属性是函数的话则这个属性就会被忽略,感兴趣的同学可以试下。

第二个参数

JSON.stringify 可以接收第二个参数,可以称为 replacer 替换器。

你可以传入一个字符串数组,这个数组中具有的属性才会被转换,就像一个白名单。

1

2

3

4

5

6

7

const boy = {

  name: 'John',

  age: 23

}

 

JSON.stringify(boy, ['name'])

// {"name":"John"}

我们可以利用这个特性,只转换需要转换的属性,过滤掉如很长的数组、错误对象等。

这个 replacer 参数还可以接收一个函数。这个函数会遍历整个对象,并将键和值传入,让你决定该如何替换它们。

1

2

3

4

5

6

7

8

9

10

11

12

13

const boy = {

  name: 'John',

  age: 23,

  hobbies: new Map([[0, 'coding'], [1, 'earn money']])

}

 

JSON.stringify(boy, (key, value) => {

  if (value instanceof Map) {

    return [...value.values()]

  }

  return value

})

// {"name":"John","age":23,"hobbies":["coding","earn money"]}

而如果你返回了 undefined (返回 null 不行),就将这个属性移除了:

阅读剩余部分

相关阅读 >>

javascript如何实现图片切换

javascript中什么是私有成员

javascript控制台console对象的方法有哪些

javascript与php的区别是什么

详解html5中localstorage存储JSON数据并读取JSON数据的实现方法

js什么意思

javascript怎么将值转换为数字类型

javascript有没有二维数组

javascript如何禁止刷新页面

javascript怎么进行强制类型转换

更多相关阅读请进入《JSON》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...