JSON.stringify()认识

深浅拷贝:JSON.parse(JSON.stringify(obj))

序列化:将对象转换为JSON字符串

javascript 复制代码
let obj = {
    name: 'String'
}
console.log(JSON.stringify(obj));   // {"name":"String"}

序列化弊端:

对象属性值为``函数序列化后属性丢失。
javascript 复制代码
let obj = {
    name: 'String',
    foo: function () {
        console.log(`${ this.name }是一个小菜鸟!`)
    }
}
console.log(JSON.stringify(obj));   // {"name":"String"}
对象属性值为undefined序列化后该属性会丢失。
javascript 复制代码
let obj = {
    name: undefined
}
console.log(JSON.stringify(obj));   // {}
对象属性值正则表达式序列化后该属性为{}
javascript 复制代码
let obj = {
    name: 'String',
    zoo: /^i/ig,
    foo: function () {
        console.log(`${ this.name }是一个小菜鸟!`)
    }
}
console.log(JSON.stringify(obj));   // {"name":"String","zoo":{}}
数组含对象,对象属性值为undefined序列化后该属性也会丢失。
javascript 复制代码
let arr = [
    {
        name: undefined
    }
]
console.log(JSON.stringify(arr));   // [{}]

序列化扩展:

JSON.stringify()``第二参数传入一个数组,值为对象key,可获取该项。
javascript 复制代码
let obj = {
    name: 'String',
    age: 25,
    hobby: ['JavaScript', 'Vue']
}
let res = JSON.stringify(obj, ['name']);

console.log(res);    // {"name":"String"}
JSON.stringify()``第二参数传入一个函数,可遍历修改每一项。
javascript 复制代码
let obj = {
    name: 'String',
    age: 25,
    hobby: ['JavaScript', 'Vue']
}
let res = JSON.stringify(obj, (key, value) => {
    if (key === 'age') return undefined;
    return value;
});

console.log(res);   // {"name":"String","hobby":["JavaScript","Vue"]}
JSON.stringify()第三参数可传入数字,表示缩进多少字符
javascript 复制代码
let obj = {
    name: 'String',
    age: 25,
    hobby: ['JavaScript', 'Vue']
}
let res = JSON.stringify(obj, null, 2);

console.log(res);  // 表示缩进2行

// {
// "name": "String",
//  "age": 25,
//  "hobby": [
//    "JavaScript",
//    "Vue"
//  ]
// }
Object自身含有toJSON属性,只有被 JSON.stringify() 调用时,toJSON 方法才会自动执行,用于自定义数据样式。
javascript 复制代码
let obj = {
    name: '小明',
    age: 25,
    toJSON: function () {
        return {
            message: `${ this.name }的年龄为${ this.age }`
        }
    }
}
let res = JSON.stringify(obj);

console.log(res);   // {"message":"小明的年龄为25"}

注:toJSON 方法只在 JSON.stringify() 被调用时起作用。如果你直接访问对象的 toJSON 属性,你会得到函数本身,而不是它的执行结果。

相关推荐
科技探秘人5 分钟前
Chrome与火狐哪个浏览器的隐私追踪功能更好
前端·chrome
科技探秘人6 分钟前
Chrome与傲游浏览器性能与功能的深度对比
前端·chrome
JerryXZR11 分钟前
前端开发中ES6的技术细节二
前端·javascript·es6
七星静香13 分钟前
laravel chunkById 分块查询 使用时的问题
java·前端·laravel
q24985969316 分钟前
前端预览word、excel、ppt
前端·word·excel
小华同学ai21 分钟前
wflow-web:开源啦 ,高仿钉钉、飞书、企业微信的审批流程设计器,轻松打造属于你的工作流设计器
前端·钉钉·飞书
problc26 分钟前
Flutter中文字体设置指南:打造个性化的应用体验
android·javascript·flutter
Gavin_91530 分钟前
【JavaScript】模块化开发
前端·javascript·vue.js
懒大王爱吃狼2 小时前
Python教程:python枚举类定义和使用
开发语言·前端·javascript·python·python基础·python编程·python书籍
待磨的钝刨3 小时前
【格式化查看JSON文件】coco的json文件内容都在一行如何按照json格式查看
开发语言·javascript·json