SON 全名JavaScript Object Notation是一种轻量级的数据交换格式,比XML更轻巧,易于阅读和编写,同时也易于机器解析和生成。它基于ECMA262语言规范(1999-12第三版)中JavaScript编程语言的一个子集。 JSON采用与编程语言无关的文本格式,但是也使用了类C语言(包括C, C++, C#, Java, JavaScript, Perl, Python等)的习惯,这些特性使JSON成为理想的数据交换格式。
进入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写法:
我们先来看完整的JSON写法:
{
'familys' = [
{'name' : 'Bruce',
'age' : 18,
'sex' : 'male'},
{'name' : 'Sherry',
'age' : 16,
'sex' : 'famale'}
]
}
JSON会建构出两种结构:(1)‘“名称” : 值’的集合;(2)Array。
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 Number:
与一般数值相同,除8 / 16进制外。
那JSON要如何使用呢?
原生的JSON格式数据,目前在IE7以上及MF 3以上,已经内建解析JSON格式的能力,但在兼容性及网络上的不确定性(其他浏览器),建议在有需要使用JSON格式的页面引用json2.js,依官方说法,请不要在使用json.js这个版本的Script了。
我们有一JSON格式的String:
有以下代码:
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);