JSON小技巧

简介: JSON小技巧

越年轻,就越不能跟丑事妥协——纪德

分享个前端的JSON.stringify以及parse小技巧

MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON

例如我们此处使用JSON.stringify({name:'VampireAchao',age:21})可以将对象转为json

如果我们只想要name值,则可以传入第二个参数,可以接受一个数组类型

JSON.stringify({name:'VampireAchao',age:21},['name'])

转出来则是'{"name":"VampireAchao"}'

如果我们要自定义规则,则可以传入一个函数类型,第一次调用时value为我们的数据对象,属于由外向内调用

let times = 0;
const json = JSON.stringify({name:'VampireAchao',age:21},(key, value) =>{
    console.log(++times)
    console.table({key,value})
    if(typeof value === 'object'||
       Array.isArray(value)){
        return value
    }
    if(typeof value !== 'string'){
        return undefined
    }
    return value
})
console.log(json)

效果如下:

如果我们需要json之间来点美观的间距,则可以传入第三个参数

JSON.stringify({name:'VampireAchao',age:21},null,'\t')

JSON.parse就不再赘述了,也可以支持第二个参数,但属于由内向外调用

let times = 0;
JSON.parse('{"name":"VampireAchao","age":21}',(key,value)=>{
   console.log(++times)
    console.table({key,value})
    if(typeof value === 'object'||
       Array.isArray(value)){
        return value
    }
    if(typeof value !== 'string'){
        return undefined
    }
    return value
})

相关文章
|
4月前
|
JSON 前端开发 JavaScript
JSON 必知必会
JSON 必知必会
|
2月前
|
存储 JSON JavaScript
JSON应用
JSON应用
28 4
|
4月前
C++Json生成
C++Json生成
25 0
|
9月前
|
JSON fastjson Java
JSON小记
JSON小记
|
11月前
|
JSON 数据格式
json的一些小理解
个人学习总结
59 0
|
JSON JavaScript 前端开发
什么是 JSON?
什么是 JSON?
76 0
|
存储 JSON JavaScript
JSON介绍
JSON介绍
171 0
|
XML Web App开发 JSON
JSON 简单了解
JSON 简单了解
181 0
JSON 简单了解
|
存储 JSON 前端开发
|
XML 存储 Web App开发