JSON 介绍
1、是什么?
一种轻量级数据格式——字符串
2、干什么?
用于计算机和网络之间存储和传输数据
3、相关语法⭐
目的:先将JS ”打包“(序列化),再 ”解压“(解析)
-
stringify(): 将JavaScript 序列化为 JSON 字符串
-
parse(): 将 JSON 解析为原生 JavaScript 值
4、序列化选项(过滤或修改流程)
JSON.stringify()
实际上,JSON.stringify()方法另外还可以接收两个参数。(第一个为JS对象)
-
第二个参数是过滤器,可以是数组或函数
-
第三个参数是用于缩进结果 JSON 字符串的选项
过滤结果
-
如果参数是一个数组,那么 JSON.stringify()返回的结果只会包含该数组中列出的对象 属性。比如:
let book = {
title: "Professional JavaScript",
authors: [
"Nicholas C. Zakas",
"Matt Frisbie"
],
edition: 4,
year: 2017
};
let jsonText = JSON.stringify(book, ["title", "edition"]);
// jsonText为JSON字符串: {"title":"Professional JavaScript","edition":4}
-
如果参数是一个函数,返回的值就是相应 key 应该包含的结果。
提供的函数接收两个参数:属性名(key)和属性值(value),这个 key 始终是字符串,只是在值不属于某个键/值对时会是空字符串。 注意,返回 undefined 会导致属性被忽略。下面看一个例子:
let book = {
title: "Professional JavaScript",
authors: [
"Nicholas C. Zakas",
"Matt Frisbie"
],
edition: 4,
year: 2017
};
let jsonText = JSON.stringify(book, (key, value) => {
switch(key) {
case "authors":
return value.join(",")
case "year":
return 5000;
case "edition":
return undefined;
default:
return value;
}
});
//最终得到的 JSON 字符串是这样的:
{"title":"Professional JavaScript","authors":"Nicholas C. Zakas,Matt
Frisbie","year":5000}
这个函数基于键进行了过滤:
如果键是"authors",则将数组值转换为字符串;
如果键是"year",则将值设置为 5000;
如果键是"edition",则返回 undefined,即忽略该属性。
字符串缩进
JSON.stringify()方法的第三个参数控制缩进和空格。
在这个参数是数值时,表示每一级缩进的空格数。例如,每级缩进 4 个空格,可以这样:
let book = {
title: "Professional JavaScript",
authors: [
"Nicholas C. Zakas",
"Matt Frisbie"
],
edition: 4,
year: 2017
};
let jsonText = JSON.stringify(book, null, 4);
这样得到的 jsonText 格式如下:
{
"title": "Professional JavaScript",
"authors": [
"Nicholas C. Zakas",
"Matt Frisbie"
],
"edition": 4,
"year": 2017
}
如果缩进参数是一个字符串而非数值,那么 JSON 字符串中就会使用这个字符串
使用数值或字符串时有 10 个字符的长度限制
toJSON()方法 (自定义过滤)
有时候,对象需要在 JSON.stringify()之上自定义 JSON 序列化。
let book = {
title: "Professional JavaScript",
authors: [
"Nicholas C. Zakas",
"Matt Frisbie"
],
edition: 4,
year: 2017,
toJSON: function() {
return this.title;
}
};
let jsonText = JSON.stringify(book);
这里 book 对象中定义的 toJSON()方法简单地返回了图书的书名(this.title)。与 Date 对象 类似,这个对象会被序列化为简单字符串而非对象。toJSON()方法可以返回任意序列化值,都可以起到相应的作用。
如果对象被嵌入在另一个对象中,返回 undefined 会导致值变成 null;
或者如果是顶级对象,则本身就是 undefined。
注意,箭头函数不能用来定义 toJSON()方法。主要原因是箭头函数的词法作用域是全局作用域,在这种情况下不合适。
toJSON()方法可以与过滤函数一起使用,因此理解不同序列化流程的顺序非常重要。
在把对象传给 JSON.stringify()时会执行如下步骤。 (1) 如果可以获取实际的值,则调用 toJSON()方法获取实际的值,否则使用默认的序列化。 (2) 如果提供了第二个参数,则应用过滤。传入过滤函数的值就是第(1)步返回的值。 (3) 第(2)步返回的每个值都会相应地进行序列化。 (4) 如果提供了第三个参数,则相应地进行缩进。 理解这个顺序有助于决定是创建 toJSON()方法,还是使用过滤函数,抑或是两者都用。
5、解析选项(过滤或修改流程)
JSON.parse()
-
可额外接受参数:函数,该函数被称为还原函数(reviver),相对于起过滤作用的替代函数(replacer)
-
举例:
let book = {
title: "Professional JavaScript",
authors: [
"Nicholas C. Zakas",
"Matt Frisbie"
],
edition: 4,
year: 2017,
releaseDate: new Date(2017, 11, 1)
};
let jsonText = JSON.stringify(book);
let bookCopy = JSON.parse(jsonText,
(key, value) => key == "releaseDate" ? new Date(value) : value);
alert(bookCopy.releaseDate.getFullYear());以上代码在 book 对象中增加了 releaseDate 属性,是一个 Date 对象。这个对象在被序列化为JSON 字符串后,又被重新解析为一个对象 bookCopy。
原文地址:https://www.cnblogs.com/jefferys232/p/15395371.html
- 1230: [Usaco2008 Nov]lites 开关灯
- 【推荐】C#线程篇---你所不知道的线程池(4)
- 洛谷P1333 瑞瑞的木棍(欧拉回路)
- 【推荐】C#线程篇---Task(任务)和线程池不得不说的秘密(5.1)
- 【LeetCode 20】关关的刷题日记45 – Valid Parenthese
- 1819: [JSOI]Word Query电子字典
- 【推荐】C#线程篇---Task(任务)和线程池不得不说的秘密(5.2)
- javascript 事件基础
- 算法模板——sap网络最大流 3(递归+邻接矩阵)
- 从Hash Killer I、II、III论字符串哈希
- angularjs 缓存详解
- 算法模板——线段树7(骰子翻转问题)
- 2729: [HNOI2012]排队
- 算法模板——sap网络最大流 2(非递归+邻接表)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- ELK 日志系统集成 Skywalking 调用链 ID
- ChartCenter ——为您的K8s之旅保驾护航v
- leetcode链表之删除链表的节点
- iOS打包的那一些事情
- 腾讯云服务器(CentOS 7、Tencent Linux)手动搭建LNMP环境(linux+Nginx+Mariadb+PHP)
- iOS技术面试题及答案
- 虽然现在有可以去码的软件了,可视频是如何自动跟踪打码的?
- 2020-09-12:手撕代码:最小公倍数,复杂度多少?
- Mac App推荐
- 美团面试问ThreadLocal,学妹一口气给他说了四种!
- BFE.dev前端刷题#108. 用队列(Queue)实现栈(Stack)
- Kafka消费过程关键源码解析
- leetcode链表之两个链表的第一个公共节点
- 测试开发基础 mvn test | 利用 Maven Surefire Plugin 做测试用例基础执行管理
- 腾讯云Elasticsearch集群规划及性能优化实践