JavaScript JSON序列化和反序列化
文章目录
- JavaScript JSON序列化和反序列化
- 概述
- JSON序列化
- JSON.stringify()
- 仅一个参数使用
- 使用2个参数
- 使用3个参数
- 其他
- 自定义toJson
- 序列化顺序
- 反序列化
- JSON.parse()
- 仅一个参数使用
- 使用2个参数
- eval()
JavaScript JSON序列化和反序列化
概述
JSON数据在网络传输时存在两种类型,一种是JSON对象类型,一种是JSON字符串类型,两种类型的转换涉及JSON序列化和反序列化的知识。
JSON序列化即将JSON对象处理为JSON字符串的过程,以方便数据的传输。JSON序列化可以通过两种方式来实现,一种是调用JSON对象内置的stringify()函数,一种是为对象自定义toJSON()函数。
JSON反序列化即将JSON字符串转换为JSON对象的过程,得到的结果用于在JavaScript中做逻辑处理。JSON反序列化的实现方式有两种,一种是使用JSON对象内置的parse()函数,一种是使用eval()函数。
JSON序列化
JSON.stringify()
语法
JSON.stringify(value, replacer, space)
说明
参数value:需要处理的值,可以为对象活数组。
参数replacer:可选参数。
- 如果其值为一个函数,则表示在序列化过程中,被序列化值的每个属性都会经过该函数的处理;
- 如果其值为一个数组,则表示只有包含在这个数组中的属性名才会被序列化到最终的JSON字符串中;
- 如果该值为null或者未传递,则value参数对应值的所有属性都会被序列化。
参数space:可选参数。用于指定缩进用的空白字符串,美化输出。
- 如果参数是个数字,则代表有多少个空格,上限值为10;
- 如果该参数的值小于1,则意味着没有空格;
- 如果参数为字符串,则取字符串的前十个字符作为空格;
- 如果没有传入参数或者传入的值为null,将没有空格。
仅一个参数使用
var obj = {name: "xiaoming",age: 18,sex: true,address: ["广东省", "广州市"]
};var jsonStr = JSON.stringify(obj);
console.log(jsonStr);
//{"name":"xiaoming","age":18,"sex":true,"address":["广东省","广州市"]}
使用2个参数
var obj = {name: "xiaoming",age: 18,sex: true,address: ["广东省", "广州市"]
};function replacerFn(key, value) {if (typeof value === "string") {return value.toUpperCase();}return value;
}var jsonStr = JSON.stringify(obj, replacerFn);
console.log(jsonStr);
//{"name":"XIAOMING","age":18,"sex":true,"address":["广东省","广州市"]}
var obj = {name: "xiaoming",age: 18,sex: true,address: ["广东省", "广州市"]
};var jsonStr = JSON.stringify(obj, ["name", "age"]);
console.log(jsonStr);
//{"name":"xiaoming","age":18}
使用3个参数
var obj = {name: "xiaoming",age: 18,sex: true,address: ["广东省", "广州市"]
};function replacerFn(key, value) {if (typeof value === "string") {return value.toUpperCase();}return value;
}
var jsonStr = JSON.stringify(obj, ["name", "age"], 10);
console.log(jsonStr);
var obj = {name: "xiaoming",age: 18,sex: true,address: ["广东省", "广州市"]
};function replacerFn(key, value) {if (typeof value === "string") {return value.toUpperCase();}return value;
}
var jsonStr = JSON.stringify(obj, ["name", "age"], "@@@");
console.log(jsonStr);
其他
var jsonStr = JSON.stringify([new Number(1), new String("false"), new Boolean(false)]);
console.log(jsonStr);
//[1,"false",false]
var jsonStr = JSON.stringify({x: undefined,y: Object,z: Symbol("")
});
console.log(jsonStr);
//{}
var jsonStr = JSON.stringify([undefined, Object, Symbol("")]);
console.log(jsonStr);
//[null,null,null]
自定义toJson
如果一个被序列化的对象拥有toJSON()函数,那么toJSON()函数就会覆盖默认的序列化行为,被序列化的值将不再是原来的属性值,而是toJSON()函数的返回值。
toJSON()函数用于更精确的控制序列化,可以看作是对stringify()函数的补充。
var obj = {name: "xiaoming",age: 18,sex: true,address: ["广东省", "广州市"],toJSON: function() {return {Name: this.name,Age: this.age,Sex: this.sex};}
};var jsonStr = JSON.stringify(obj);
console.log(jsonStr);
//{"Name":"xiaoming","Age":18,"Sex":true}
序列化顺序
序列化处理的顺序如下:
- 如果待序列化的对象存在toJSON()函数,则优先调用toJSON()函数,以toJSON()函数的返回值作为待序列化的值,否则返回JSON对象本身。
- 如果stringify()函数提供了第二个参数replacer,则对上一步的返回值经过replacer参数处理。
- 如果stringify()函数提供了第三个参数,则对JSON字符串进行格式化处理,返回最终的结果。
反序列化
JSON.parse()
语法
JSON.parse(text, reviver)
说明
参数text:待解析度JSON字符串。
参数reviver:可选参数。
- 如果是一个函数,则规定了原始值在返回之前如何被解析改造。
- 如果被解析的JSON字符串是非法的,则会抛出异常。
仅一个参数使用
var arrStr = '[1,true,"hello"]';
var arr = JSON.parse(arrStr);
console.log(arr); //[1, true, "hello"]
var objStr = `{
"name":"xiaoming",
"age":18,
"address":"beijing"
}`;
var obj = JSON.parse(objStr);
console.log(obj); //{name: "xiaoming", age: 18, address: "beijing"}
var a = "12.34";
var result = JSON.parse(a);
console.log(result); //12.34
使用2个参数
var objStr = `{
"name":"xiaoming",
"age":18,
"address":"beijing"
}`;
var result = JSON.parse(objStr, function(key, value) {if (key === "name") {return value + "先生";}if (key === "age") {return value + "岁";}return value;
});
console.log(result); //{name: "xiaoming先生", age: "18岁", address: "beijing"}
eval()
eval()函数用于计算JavaScript字符串,并把它作为脚本来执行。
语法
eval("(" + str + ")")
说明
这里为什么要使用括号将拼接出来的字符串括起来呢?
因为JSON字符串是以“{}”表示开始和结束,在JavaScript中它会被当作一个语句块来处理,所以必须强制将它处理成一个表达式,所以采用括号。
使用
var objStr = `{
"name":"xiaoming",
"age":18,
"address":"beijing"
}`;
var result = eval("(" + objStr + ")");
console.log(result); //{name: "xiaoming先生", age: "18岁", address: "beijing"}
JavaScript JSON序列化和反序列化相关推荐
- Javascript JSON 序列化和反序列化
前言 JavaScript内置了JSON的解析 JSON还定死了字符集必须是UTF-8,表示多语言就没有问题了. 为了统一解析,JSON的字符串规定必须用双引号"",Object的 ...
- DotNet的JSON序列化与反序列化
JSON(JavaScript Object Notation)JavaScript对象表示法,它是一种基于文本,独立于语言的轻量级数据交换格式.在现在的通信中,较多的采用JSON数据格式,JSON有 ...
- .NET MVC第九章、Web Api Json序列化与反序列化
.NET MVC第九章.Web Api Json序列化与反序列化 目录 .NET MVC第九章.Web Api Json序列化与反序列化 json数据格式 JSON 语法 返回对象 Json序列化 反 ...
- php json字符串序列化,JSON序列化与反序列化实现方法(附代码)
这次给大家带来JSON序列化与反序列化实现方法(附代码),JSON序列化与反序列化实现的注意事项有哪些,下面就是实战案例,一起来看一下. 一.JSON简介 JSON(JavaScript Object ...
- JSON序列化和反序列化还有这种玩法
Mixin对于前端开发者可不陌生,Vue.React等知名前端框架都使用了Mixin.而对于后端开发,尤其是Java后端开发来说Mixin却是一个很陌生的概念.今天来我们通过Jackson让后端开发者 ...
- C#中JSON序列化和反序列化
有一段时间没有到博客园写技术博客了,不过每天逛逛博客园中大牛的博客还是有的,学无止境-- 最近在写些调用他人接口的程序,用到了大量的JSON.XML序列化和反序列化,今天就来总结下json的序列化和反 ...
- json 反序列化 父子类型_Jaskson精讲第7篇-类继承关系下的JSON序列化与反序列化JsonTypeInfo...
Jackson是Spring Boot(SpringBoot)默认的JSON数据处理框架,但是其并不依赖于任何的Spring 库.有的小伙伴以为Jackson只能在Spring框架内使用,其实不是的, ...
- Go进阶(7): JSON 序列化和反序列化
1. json序列化和反序列化基础 json数据的序列化和反序列化是一种非常常见的方式,尤其是在http/rcp的微服务调试中. 基础语法 在 Go 中我们主要使用官方的 encoding/json ...
- 序列化对象C++对象的JSON序列化与反序列化探索
新手发帖,很多方面都是刚入门,有错误的地方请大家见谅,欢迎批评指正 一:背景 作为一名C++开发人员,我始终很期待能够像C#与JAVA那样,可以省力的进行对象的序列化与反序列化,但到现在为止,还没有找 ...
最新文章
- 8岁网红博主蝉联YouTube收入榜第一,今年赚了1.8亿
- AX 2009 时间类型函数操作
- linux驱动(七)gpiolib库详解
- python数据科学-多变量数据分析
- junit测试找不到数据库_将数据库日志添加到JUnit3
- 【CF#801 A.】 Vicious Keyboard(字符串查找,水题)
- ANSI/UTF-8/UCS2(UTF-16),以及回车换行
- 福建学业水平测试计算机考点大纲,福建高中信息技术学业水平考试说明大纲
- 【Interfacenavigation】规划多个触摸屏尺寸(57)
- 成年人の内部 福利 不敢高调分享……
- 非IE浏览器实现IE功能(浏览器加载OCX控件)——IE Tab
- 微积分英文书籍第八版 CALCULUS eight edition
- wo-27s管理员账户和密码_Mac管理员忘记密码怎么办?
- Latex小写字母花体方法
- cadence——基本操作6
- 显卡驱动无法更新代码19注册列表位置
- 2021-2022年新版监控量测软件 边坡,基坑,隧道监测系统
- 第四次软件工程团队作业:“希希敬敬对”队团队展示
- 优达(Udacity)smartcab
- 用‘+‘替换字符串中的所有空格[复制]
热门文章
- 我校将创办阿里巴巴商学院
- Quicker的小程序
- 苹果确认不会放弃Touch ID,iPhone 11还没发布就火爆一片,真是香啊
- iOS 8 设置导航栏的背景颜色和背景图片
- SAP ABAP APO PPDS 计划(生产)订单报工事件
- 谷歌浏览器paused in debugger怎么关闭
- Thinkphp内核手机壳DIY定制平台源码
- HTML5新增属性来实现立体字效果
- LeetCode(String) 2011. Final Value of Variable After Performing Operations
- 读书笔记|指数型函数对算法的影响实际应用-day3