前言
本文将解了json的一些基础知识,与深入了解json,本文是作者的一些理解与在网络上搜集的一些知识,并不全面,如有错误请在评论区指出。觉得本文对你有所帮助请三连支持博主,你的支持是我更新的动力,先赞后看养成习惯。
以下是本篇文章正文内容
一、初识json
1.1 JSON概念
JSON 全名JavaScript Object Notation是一种轻量级的数据交换格式,比XML更轻巧,易于阅读和编写,同时也易于机器解析和生成。它基于ECMA262语言规范(1999-12第三版)中JavaScript编程语言的一个子集。JSON采用与编程语言无关的文本格式,但是也使用了类C语言(包括C, C++, C#, Java, JavaScript, Perl, Python等)的习惯,这些特性使JSON成为理想的数据交换格式。
1.2 JavaScript内建对象
进入JSON前,先简单介绍一下JavaScript内建对象’Array对象第一段‘Array声明’的地方,声明一个Javascript Array对象,基本上是两种语法:
// 正式声明 var team1 = new Array('Bruce', 'Sherry', 'Happy'); // 整合声明 var team2 = ['Bruce', 'Sherry', 'Happy']; alert(team1[0]); // Bruce alert(team2[2]); // Happy
一个比较正式,一个是比较简写,通常Javascript写久了,会采用第二种方式来声明Array。
再来看Javascript对象的声明,基本上也是两种:
// 正式声明 var Bruce = new Object(); Bruce.name = 'King Kong'; Bruce.age = 18; Bruce.sex = 'male'; alert(Bruce.age); // 18 // 整合声明 var Bruce = { 'name' : 'King Kong', 'age' : 18, 'sex' : 'male' } alert(Bruce.name); // King Kong alert(Bruce[name]); // King Kong
一样,久了也是会选第二种来写,再来我们看看Javascript的‘Array + Object’的声明:
// 声明一个familys Array,里面包含两个Object var familys = [ {'name' : 'Bruce', 'age' : 18, 'sex' : 'male'}, {'name' : 'Sherry', 'age' : 16, 'sex' : 'famale'} ]; alert(family[0].name); // Bruce alert(family[1].sex); // famale
到这里你已经会了JSON的80%了,JSON (JavaScript Object Notation)已经说明的很清楚了,它是一个JavaScript的子集,它利用Object与Array来表示数据,让数据很容易的可以交换使用。
JSON写法:
{ 'familys' = [ {'name' : 'Bruce', 'age' : 18, 'sex' : 'male'}, {'name' : 'Sherry', 'age' : 16, 'sex' : 'famale'} ] }
JSON Object: 以"{“开始,以”}“结尾 每个名称后跟着一个”:" 每对"名称:值"之间用","分隔
{ // 以"{"开始 'name' : 'Bruce', // 每个名称后跟着一个":" 'age' : 18, // 每对"名称:值"之间用","分隔 'sex' : 'male' } // 以"}"结尾
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。