2024年最新JSON从入门到大师_json讲的好的csdn博主(3)，一次违反常规的大数据开发大厂面试经历

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上大数据知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

需要这份系统化资料的朋友，可以戳这里获取

---

JSON Array：　以"[“开始，以”]“结尾　　值之间使用”,"

{
　　// familys为一维数组，数组里包含两笔对象数据
　　'familys' = [ // 以"["开始
　　
　　{'name' : 'Bruce',
　
　　'age' : 18,
　
　　'sex' : 'male'}, // 值之间使用","
　　
　　{'name' : 'Sherry',
　
　　'age' : 16,
　　
　　'sex' : 'famale'}
　
　　] // 以"]"结尾
　　
　　}

JSON Value：

值本身可以是String、Number、true、false、null、Object、Array;

JSON String：

由双引号包围的任意Unicode字符集合。可以使用"反斜线()"来转义。

---

二、JSON的使用

那JSON要如何使用呢?

原生的JSON格式数据，目前在IE7以上及MF 3以上，已经内建解析JSON格式的能力，但在兼容性及网络上的不确定性(其他浏览器)，建议在有需要使用JSON格式的页面引用json2.js，依官方说法，请不要在使用json.js这个版本的Script了。

有以下代码：

var jsonData = "{'familys'=[{'name' : 'Bruce', 'age' : 18, 'sex' : 
'male'},
　　
　　{'name' : 'Sherry','age' : 16, 'sex' : 'famale'}]}"

方法一：使用eval()

这个方法会引发安全性问题，我就不介绍了。

方法二：使用json2.js (IE7以上及MF 3以上可以不引用)

先在网页中引用json2.js，然后使用json2所提供的parse方法：

var jsonData = "{'familys'=[{'name' : 'Bruce', 'age' : 18, 'sex' : 
'male'},
　　
　　{'name' : 'Sherry','age' : 16, 'sex' : 'famale'}]}"
　
　　var jsonObj = JSON.parse(jsonData); // 将JSON格式数据转为对象
　　
　　alert(jsonObj.familys[0].name); // Bruce
　　
　　alert(jsonObj.familys[1].age); // 16

这样之后，我们就能在Ajax函数将服务器传回的JSON格式做解析：

// ...
　　if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
　　var jsonObj = JSON.parse(xmlHttp.responseText);
　　// ...
　　}

使用了JSON来交换数据后，你会发现相关Ajax的源程序变简单了，例如：

// 原始Ajax函数
　　function Do(xmlHttp) {
　　if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
　　var familys = xmlHttp.responseXML.getElementsByTagName('familys');
　　for (var i = 0; i < familys.length; i++) {
　　var name = 
familys.getElementsByTagName('name')[0].firstChild.nodeValue;
　　var age = familys.getElementsByTagName('age')[0].firstChild.nodeValue;
　　var sex = familys.getElementsByTagName('sex')[0].firstChild.nodeValue;
　　}
　　}
　　}
　　// 使用JSON后的Ajax函数
　　function Do(xmlHttp) {
　　if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
　　var jsonObj = JSON.parse(xmlHttp.responseText);
　　var name = jsonObj.familys[0].name;
　　var age = jsonObj.familys[0].age;
　　var sex = jsonObj.familys[0].sex;
　　}

不只有变简单，而且程序的撰写更直觉。另外，你也可以把Object转为JSON：

// 声明一个familys Array，里面包含两个Object
　　var familys = [
　　{'name' : 'Bruce',
　　'age' : 18,
　　'sex' : 'male'},
　　{'name' : 'Sherry',
　　'age' : 16,
　　'sex' : 'famale'}
　　];
　　var jsonData = JSON.stringify(familys);

---

三、深入了解JSON

3.1 JSON和JS对象

很多时候都听到“JSON是JS的一个子集”这句话，而且这句话我曾经也一直这么认为，每个符合JSON格式的字符串你解析成js都是可以的，直到后来发现了一个奇奇怪怪的东西。

1.两个本质不同的东西为什么那么密切

JSON和JS对象本质上完全不是同一个东西，就像“斑马线”和“斑马”，“斑马线”基于“斑马”身上的条纹来呈现和命名，但是斑马是活的，斑马线是非生物。

同样，”JSON”全名”JavaScript Object Notation”，所以它的格式（语法）是基于JS的，但它就是一种格式，而JS对象是一个实例，是存在于内存的一个东西。

说句玩笑话，如果JSON是基于PHP的，可能就叫PON了，形式可能就是这样的了[‘propertyOne’ => ‘foo’, ‘propertyTwo’ => 42,]，如果这样，那么JSON可能现在是和PHP比较密切了。

此外，JSON是可以传输的，因为它是文本格式，但是JS对象是没办法传输的，在语法上，JSON也会更加严格，但是JS对象就很松了

那么两个不同的东西为什么那么密切，因为JSON毕竟是从JS中演变出来的，语法相近。

---

2 JSON格式别JS对象语法表现上严格在哪

可以看到，相对于JS对象，JSON的格式更严格，所以大部分写的JS对象是不符合JSON的格式的。

另外，除了常见的“正常的”JSON格式，要么表现为一个对象形式{…}，要么表现为一个数组形式[…]，任何单独的一个10进制数值、双引号字符串、布尔值和null都是有效符合JSON格式的

---

3.一个有意思的地方，JSON不是JS的子集

将以下代码copy到控制台执行

var code = '"\u2028\u2029"';  
JSON.parse(code); // works fine 
eval(code); // fails 

这两个字符\u2028和\u2029分别表示行分隔符和段落分隔符，JSON.parse可以正常解析，但是当做js解析时会报错。

---

3.2 JS中的JSON函数

在JS中我们主要会接触到两个和JSON相关的函数，分别用于JSON字符串和JS数据结构之间的转化，一个叫JSON.stringify，它很聪明，聪明到你写的不符合JSON格式的JS对象都能帮你处理成符合JSON格式的字符串，所以你得知道它到底干了什么，免得它只是自作聪明，然后让你Debug long time；

另一个叫JSON.parse，用于转化json字符串到JS数据结构，它很严格，你的JSON字符串如果构造地不对，是没办法解析的。

而它们的参数不止一个，虽然我们经常用的时候只传入一个参数。此外，还有一个toJSON函数，我们较少看到，但是它会影响JSON.stringify。

---

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

715298779827)]

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！