小课堂【武汉第137期】

JSON是什么，如何处理转义？

                                                  分享人：叶紫阳

1.背景介绍

数据传输是我们在编写代码时经常遇到的一个场景。给数据一个统一的格式有利于我们编写和解析数据。

json，是数据格式的一种，在其与后端的数据交换中有较为广泛的应用。

2.知识剖析

2.1 什么是JSON

JSON是一种格式，基于文本，优于轻量，用于交换数据。

一种数据格式

基于文本的数据格式

轻量级的数据格式

被广泛地用于数据交换

2.1.1一种数据格式

姓名“二百六”，身高“4000px”，体重“60kg”

name="二百六"&height="4000px"&weight="60kg"

<person><name>二百六</name><height>160</height><weight>60</weight></person>

{"name":"二百六","height":160,"weight":60}

2.1.2基于文本的数据格式

JSON是基于文本的数据格式，相对于基于二进制的数据，所以JSON在传递的时候是传递符合JSON这种格式的字符串，而不是一个对象。

2.1.3轻量级的数据格式

在JSON之前，有一个数据格式叫xml，现在还是广泛在用，但是JSON更加轻量，如xml需要用到很多标签，像上面的例子中，你可以明显看到xml格式的数据中标签本身占据了很多空间，而JSON比较轻量，即相同数据，以JSON的格式占据的带宽更小，这在有大量数据请求和传递的情况下是有明显优势的。

2.1.4被广泛地用于数据交换

轻量已经是一个用于数据交换的优势了，但更重要的JSON是易于阅读、编写和机器解析的，即这个JSON对人和机器都是友好的，而且又轻，独立于语言（因为是基于文本的），所以JSON被广泛用于数据交换。
以前端JS进行ajax的POST请求为例，后端PHP处理请求为例：

前端构造一个JS对象，用于包装要传递的数据，然后将JS对象转化为JSON字符串，再发送请求到后端；

后端PHP接收到这个JSON字符串，将JSON字符串转化为PHP对象，然后处理请求。

2.2 JS中的JSON函数

JSON.stringify:将JS数据结构转化为符合JSON格式的对象，再将该对象转化为字符串。

JSON.parse:将JSON字符串解析为JS数据结构。

3.常见问题

1. 什么是json？

2. 什么是JSON对象？

3.  json对象和js对象有什么区别？

4. 什么是json格式？

4.解决方案

什么是JSON？

json指的就是一种格式，一种数据交换的格式，"JSON"全名"JavaScript Object Notation"，所以它的格式（语法）是基于JS的，但它就是一种格式，而JS对象是一个实例，是存在于内存的一个东西。
说句玩笑话，如果JSON是基于PHP的，可能就叫PON了，形式可能就是这样的了['propertyOne' => 'foo', 'propertyTwo' => 42,]，如果这样，那么JSON可能现在是和PHP比较密切了。

什么是JSON对象？

JSON对象实际上是指js内置的一个静态对象，有2个方法，分别用于JSON字符串和JS数据结构之间的转化。

但是对于一个符合json格式的js对象，我们有时候也会简称为json对象，实际上这种叫法不对容易造成误解，只有js对象，或者json格式，没有所谓的json对象这种说法（除非是特指JSON这个原生的静态对象），只有符合json格式的js对象这一说法。

JSON格式与JS对象语法的区别？

没有json对象，只有符合json格式的对象，所以问题应该换成普通的对象和json格式的对象有什么区别？

什么是JSON格式？

数据以键值对的形式存储，和对象的格式有点像

var person={name:"哈士奇"};
//一个普通的js对象
var obj2 = {"width":100,"height":200,"name":"rose"};
// 可把这个称做：JSON 格式的 JavaScript 对象

var str1 = '{"width":100,"height":200,"name":"rose"}';
// 可把这个称做：JSON 格式的字符串

var arr = [
   {"width":100,"height":200,"name":"rose"},
   {"width":100,"height":200,"name":"rose"},
   {"width":100,"height":200,"name":"rose"},
];
// 这个可叫JSON格式的数组，是JSON的稍复杂一点的形式

var str2='['+
      '{"width":100,"height":200,"name":"rose"},'+
      '{"width":100,"height":200,"name":"rose"},'+
      '{"width":100,"height":200,"name":"rose"},'+
      ']';
// 这个可叫稍复杂一点的 JSON 格式的字符串                    

5.扩展思考

JSON.STRINGIFY方法的第二个参数

JSON.stringify方法的第二个参数可以是数组。也可以是方法。

如果第二个参数是一个函数，那么序列化过程中的每个属性都会被这个函数转化和处理

如果第二个参数是一个数组，那么只有包含在这个数组中的属性才会被序列化到最终的JSON字符串中

6.参考文献

参考文献：JSON：如果你愿意一层一层剥开我的心，你会发现...这里水很深——深入理解JSON

7.更多论讨

JSON和XML作为数据传输的格式分别有什么优缺点？

ppt:

https://ptteng.github.io/PPT/PPT/js-05-jsonAndEscape.html#/

视频：

https://v.qq.com/x/page/y0395md3r4s.html