关于javascript:前端-JavaScript-中-JSONstringify-的基本用法

31次阅读

共计 2184 个字符,预计需要花费 6 分钟才能阅读完成。

前言

在开发工作中,咱们可能会碰到这样的需要:须要将某个对象内容弹窗显示或者保留在文件中,这时候如果你间接弹窗的话,很可能就是上面这样的:

因为很多接口它对参数有要求,比方只能是字符串之类的。

这时候,就须要咱们将对象转换为字符串进行输入,JSON.stringify() 办法就能够帮咱们实现将对象转为字符串的过程。

办法形容

JSON.stringify() 办法将一个 JavaScript 对象或值转换为 JSON 字符串,如果指定了一个 replacer 函数,则能够选择性地替换值,或者指定的 replacer 是数组,则可选择性地仅蕴含数组指定的属性。

语法

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

参数阐明

  • value 将要序列化成 一个 JSON 字符串的值。
  • replacer(可选)

    • 如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会通过该函数的转换和解决;
    • 如果该参数是一个数组,则只有蕴含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中;
    • 如果该参数为 null 或者未提供,则对象所有的属性都会被序列化。
  • space(可选) 指定缩进用的空白字符串,用于丑化输入(pretty-print);如果参数是个数字,它代表有多少的空格;下限为 10。

    • 如果省略 space,则将生成返回值文本,而没有任何额定空格。
    • 如果 space 是一个数字,则返回值文本在每个级别缩进指定数目的空格。如果 space 大于 10,则文本缩进 10 个空格。
    • 如果 space 是一个非空字符串(例如“\t”),则返回值文本在每个级别中缩进字符串中的字符。
    • 如果 space 是长度大于 10 个字符的字符串,则应用前 10 个字符。

返回值

一个示意给定值的 JSON 字符串。

惯例用法

console.log(JSON.stringify({name: "obj"}))
// '{"name":"obj"}'

repalacer 参数

replacer 参数能够是一个函数或者一个数组。作为函数,它有两个参数,键(key)和值(value),它们都会被序列化。

在开始时, replacer 函数会被传入一个空字符串作为 key 值,代表着要被 stringify 的这个对象。随后每个对象或数组上的属性会被顺次传入。

函数该当返回 JSON 字符串中的 value, 如下所示:

  • 如果返回一个 Number,转换成相应的字符串作为属性值被增加入 JSON 字符串。
  • 如果返回一个 String,该字符串作为属性值被增加入 JSON 字符串。
  • 如果返回一个 Boolean,“true” 或者 “false” 作为属性值被增加入 JSON 字符串。
  • 如果返回任何其余对象,该对象递归地序列化成 JSON 字符串,对每个属性调用 replacer 办法。除非该对象是一个函数,这种状况将不会被序列化成 JSON 字符串。
  • 如果返回 undefined,该属性值不会在 JSON 字符串中输入。

有以下对象:

const data = [
    {
        name: "person1",
        sex: 0,
        age: 18,
        isStudent: true
    },
    {
        name: "person2",
        sex: 1,
        age: 25,
        isStudent: false
    },
    {
        name: "person3",
        sex: 0,
        age: 15,
        isStudent: true
    }
]

接下来咱们针对这个对象做各种需要实现。

只输入姓名和性别

const res = JSON.stringify(data, ["name", "sex"])
console.log(res);
// `[{"name":"person1","sex":0},{"name":"person2","sex":1},{"name":"person3","sex":0}]`

JSON.stringify() 提供了拆散出本人须要的那局部数据。

将性别转为中文字符

const res = JSON.stringify(data, (key, value) => {if (key == 'sex') {return ["女", '男'][value];
    }
    return value;
})
console.log(res);
// `[{"name":"person1","sex":"女","age":18,"isStudent":true},{"name":"person2","sex":"男","age":25,"isStudent":false},{"name":"person3","sex":"女","age":15,"isStudent":true}]`

JSON.stringify() 提供了回调函数做一个映射关系。

space 参数

const res = JSON.stringify(data, ["name", "sex"],4)
console.log(res);

输入如下:

这里应用了 4 个空格作为层级缩进。

留神:应用“\t”失去的后果和应用 4 个空格失去的后果看起来很像,但理论不是一回事。

总结

JSON.stringify() 办法能够通过参数管制输入的数据和格局,灵便利用它会大大提高咱们的工作效率。

学习乏味的常识,结识乏味的敌人,塑造乏味的灵魂!

我是〖编程三昧〗的作者 隐逸王 ,我的公众号是『编程三昧』,欢送关注,心愿大家多多指教!

你来,怀揣冀望,我有墨香相迎!你归,无论得失,唯以余韵相赠!

常识与技能并重,内力和外功兼修,实践和实际两手都要抓、两手都要硬!

正文完
 0