JSON入门学习案例笔记

1.JSON是什么:

JSON 即JavaScript Object Notation,它是一种轻量级的数据交换格式,非常适合于服务器与JavaScript的交互。JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写,同时也易于机器解析和生成。它基于JavaScript的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。这些特性使JSON成为理想的数据交换语言。

JSON 是一种基于文本的开放式数据交换格式。与 XML 一样,它便于读者阅读、独立于平台,并且具有广泛的可实现性。根据 JSON 标准设置格式的数据是轻型的,可由 JavaScript 实现轻而易举地进行分析,使之成为适用于 Ajax web 应用程序的理想数据交换格式。JSON 主要是一种数据格式,因此它不局限于 Ajax web 应用程序,在任何场合,只要应用程序需要将结构化信息作为文本进行交换或存储,即可使用它。

JSON 天生是为 JavaScript 准备的,因此,JSON 的数据格式非常简单,您可以用 JSON 传输一个简单的 String,Number,Boolean,也可以传输一个数组,或者一个复杂的 Object 对象。

JSON  (JavaScript Object Natation):是一种轻量级的数据交换格式,和XML一样,基于纯文本的数据格式,可以表达String、Number、Boolean、数组、甚至对象等数据

适合于服务器与JavaScript客户端的交互,JSON实际上是基于JavaScript语法的一个子集。

2.JSON出现的背景:

许多宣传关于 XML 如何拥有跨平台,跨语言的优势,但是:除非应用于 Web Services,否则,在普通的 Web 应用中,开发者经常为 XML 的解析伤透了脑筋,无论是服务器端生成或处理 XML,还是客户端用 JavaScript 解析 XML,都常常导致复杂的代码,极低的开发效率。实际上,对于大多数 Web 应用来说,他们根本不需要复杂的 XML 来传输数据,XML 的扩展性很少具有优势,许多 AJAX 应用甚至直接返回 HTML 片段来构建动态 Web 页面。和返回 XML 并解析它相比,返回 HTML 片段大大降低了系统的复杂性,但同时缺少了一定的灵活性。JSON的出现可以说是为了满足这方面的需求。方便轻松集成到HTML页面中以满足Ajax的要求。

JSON 为 Web 应用开发者提供了另一种数据交换格式。同 XML 或 HTML 片段相比,JSON 提供了更好的简单性和灵活性。

3.值的表示

字符串、数值、true、false、null、Object或数组等。

字符串

"abc"  、 "\r\n"  、 "\u00A9"

数值

123 、 -123.5

布尔

true 、 false

null

对象是一个无序的“‘名称/值’对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’ 对”之间使用“,”(逗号)分隔。

数组是值(value)的有序集合。一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间使用“,”(逗号)分隔。

数组表示

使用 [ ] 包含所有元素,每个元素用逗号分隔,元素可以是任意的值。

比如:

[ "abc" , 123 , true, null ]

访问其中的元素,使用索引号,从 0 开始。

复杂数据表示

Object或数组中的值还可以是另一个 Object 或者数组 ,以表示更复杂的数据

比如:

List list=new ArrayList();

List.add(emp)

[

{"name":"张三", "age":18 , "loves":["看书","玩游戏"]},

{"name":"王五", "age": 20,"loves":["旅游"]}

]

值(value)可以是双引号括起来的字符串(string)、数值(number)、true、false、 null、对象(object)或者数组(array)。这些结构可以嵌套。

Object表示

用 { } 包含一系列无序的 Key-Value 键值对表示,其中Key和Value之间用冒号分割,每个key-value之间用逗号分割。

比如:

{ "bookname":"Ajax基础",

"publisher":"电子工业出版社",

"price": 56.0

}

访问其中的数据,通过obj.key来获取对应的value

4.JSON 与XML对比

2 可读性 JSON和XML的可读性可谓不相上下,一边是建议的语法,一边是规范的标签形式,很难分出胜负。

2 可扩展性 XML天生有很好的扩展性,JSON当然也有,没有什么是XML能扩展,JSON不能的。

2 编码难度 XML有丰富的编码工具,比如Dom4j、JDom等,JSON也有json.org提供的工具,但是JSON的编码明显比XML容易许多,即使不借助工具也能写出JSON的代码,可是要写好XML就不太容易了。

2 解码难度 XML的解析得考虑子节点父节点,让人头昏眼花,而JSON的解析难度几乎为0。

2 流行度 XML已经被业界广泛的使用,而JSON才刚刚开始,但是在Ajax这个特定的领域,未来的发展一定是XML让位于JSON。到时Ajax应该变成Ajaj(Asynchronous JavaScript and JSON)了。

5.转换

<!--

文本格式数据如何解析成对象:使用JavaScript的eval()函数

-->

例如:

<script type="text/javascript">

var j="{‘name‘:‘张狂‘,‘age‘:25}";

var obj=eval("("+j+")");

alert(obj.name);

</script>

jQeury的专门处理JSON格式数据的方法

$.getJSON(url [,data] [,callback])

url是必须的,请求的服务器URL地址

data 可选,传递的参数,格式为 {name:value,...}

callback 可选,回调函数的参数,已经是解析后的JSON对象

5.JSON应用实例:

下面的代码显示了JSON存储数据比XML要简单得多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>

<div>
	<input align="middle" type="button" value="获取用户信息" onclick="showUser();"/>
</div>
<hr/>
<div id="bd">
</div>

<!--
将此XML片段的用户信息转化为JSON表示,并输出在页面:
<content>
	<user>
		<username>andy</username>
		<age>20</age>
		<info>
			<tel>123456</tel>
			<cellphone>191198765</tel>
		</info>
 		<address>
  			<city>Beijing</city>
   			<postcode>222333</postcode>
   		</address>
   		<address>
   			 <city>newyork</city>
			 <postcode>555666</postcode>
	    </address>
	</user>
</content>
-->
<script type="text/javascript">
	   function showUser()
	   {
	   		//使用json创建一个user对象
			var user=
			{
				"username":"andy",
				"age":20,
				"info":{"tel":"123456","cellphone":"191198765"},
				"address":
				[
					{"city":"Beijing","postcode":"222333"},
					{"city":"newyork","postcode":"555666"}
				]
		}
			//创建一个表格对象
			var tb=document.createElement("table");
			//设置表格的边框为2
			tb.border=2;
			tb.width=300;
			tb.height=8;
			tb.align="center";
			//创建表格标题对象
			var caption=tb.createCaption();
			caption.innerHTML="用户信息";

			//插入表格内的行
			var tr=tb.insertRow(0);
				//插入行内的列
				var td=tr.insertCell(0);
				td.innerHTML="username";
				var td=tr.insertCell(1);
				td.innerHTML=user.username;
				//插入表格内的行
			var tr1=tb.insertRow(1);
				//插入行内的列
				var td1=tr1.insertCell(0);
				td1.innerHTML="age";
				var td1=tr1.insertCell(1);
				td1.innerHTML=user.age;
			var tr2=tb.insertRow(2);
				//插入行内的列
				var td2=tr2.insertCell(0);
				td2.innerHTML="tel";
				var td2=tr2.insertCell(1);
				td2.innerHTML=user.info.tel;
		   	var tr3=tb.insertRow(3);
				//插入行内的列
				var td3=tr3.insertCell(0);
				td3.innerHTML="cellphone";
				var td3=tr3.insertCell(1);
				td3.innerHTML=user.info.cellphone;
			var tr4=tb.insertRow(4);
				//插入行内的列
				var td4=tr4.insertCell(0);
				td4.innerHTML="city";
				var td4=tr4.insertCell(1);
				td4.innerHTML=user.address[0].city;
			var tr5=tb.insertRow(5);
				//插入行内的列
				var td5=tr5.insertCell(0);
				td5.innerHTML="postcode";
				var td5=tr5.insertCell(1);
				td5.innerHTML=user.address[0].postcode;
			var tr6=tb.insertRow(6);
				//插入行内的列
				var td6=tr6.insertCell(0);
				td6.innerHTML="city";
				var td6=tr6.insertCell(1);
				td6.innerHTML=user.address[1].city;
			var tr7=tb.insertRow(7);
				//插入行内的列
				var td7=tr7.insertCell(0);
				td7.innerHTML="postcode";
				var td7=tr7.insertCell(1);
				td7.innerHTML=user.address[1].postcode;	

			document.getElementById("bd").appendChild(tb);
	   }
</script>
</body>
</html>

下面代码显示了JSON是如何简化创建JavaScript对象的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script type="text/javascript">
	function person(name,age,home)
	{
		this.name=name;
		this.age=age;
		this.home=home;
	}
	var p=new person("玛丽苏",3,"苏格兰");
	//alert(p.name+p.age+p.home);
	var pj={
		"name":"玛丽苏j",
		"age":3,
		"home":"苏格兰j"
	}
	alert(pj.name+pj.age+pj.home);
</script>
<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<!--
文本格式数据如何解析成对象:使用JavaScript的eval()函数
-->
<script type="text/javascript">
	var j="{'name':'张狂','age':25}";
	var obj=eval("("+j+")");
	alert(obj.name);
</script>
<body>
</body>
</html>
时间: 2024-10-05 22:33:47

JSON入门学习案例笔记的相关文章

SpringMVC入门学习案例笔记

一.数据库环境用mysql,数据库建表语句如下: /* SQLyog v10.2 MySQL - 5.1.72-community : Database - mybatis ********************************************************************* */ /*!40101 SET NAMES utf8 */; /*!40101 SET SQL_MODE=''*/; /*!40014 SET @[email protected]@UN

Surveillance Monitering入门学习论文笔记(一)

本科毕业设计需要,最近开始进行Surveillance Monitering的入门学习.对看过的论文进行一些摘录和整理,一方面方便自己勘察,另一方面可以与大家进行交流学习.由于水平.基础有限,希望大家不吝赐教,谢谢~ 论文来自: [1]胡琼,秦磊,黄庆明. 基于视觉的人体动作识别综述[J]. 计算机学报,2013,12:2512-2524. ******************************************************* 部分内容为网上摘录,由于时间有限未能列出所有

[小甲鱼]入门学习python笔记 【魔法方法】

//__new__(cls[,....]) //对象实例化调用的第一个方法,它的第一个参数是这个类,而其他参数会直接传递给__init__()方法 //需要在基类的基础上对其进行修改时重写__new__()方法 //__del__()方法 //只有在该类实例化的对象全部被del掉时,才调用__del__()方法 //python 中的运算符重载 class New_int(int): //基于基类int的子类New_int def__add__(self,other) //重载运算符 + ret

Json.Net学习笔记

http://www.cnblogs.com/xiaojinhe2/archive/2011/10/28/2227789.html Newtonsoft.Json(Json.Net)学习笔记 http://www.cnblogs.com/freshman0216/p/4161800.html http://www.cnblogs.com/xwgli/archive/2013/08/30/3290964.html

Hadoop入门学习笔记---part4

紧接着<Hadoop入门学习笔记---part3>中的继续了解如何用java在程序中操作HDFS. 众所周知,对文件的操作无非是创建,查看,下载,删除.下面我们就开始应用java程序进行操作,前提是按照<Hadoop入门学习笔记---part2>中的已经在虚拟机中搭建好了Hadoop伪分布环境:并且确定现在linux操作系统中hadoop的几个进程已经完全启动了. 好了,废话不多说!实际的例子走起. 在myeclipse中新建一个java工程: 在项目工程中新建一个lib包用于存放

Hadoop入门学习笔记---part1

随着毕业设计的进行,大学四年正式进入尾声.任你玩四年的大学的最后一次作业最后在激烈的选题中尘埃落定.无论选择了怎样的选题,无论最后的结果是怎样的,对于大学里面的这最后一份作业,也希望自己能够尽心尽力,好好做.正是因为选题和hadoop有关,现在正式开始学习hadoop.将笔记整理于此,希望与志同道合的朋友共同交流. 作者:itRed 邮箱:[email protected] 个人博客链接:http://www.cnblogs.com/itred 好了,废话不多说.进入正题!开始hadoop的学习

汇编入门学习笔记 (六)—— si、di,双重循环

疯狂的暑假学习之  汇编入门学习笔记 (六)-- si.di,双重循环 参考: <汇编语言> 王爽 第7章 1. and和or指令,与[bx+idata] and和or,就不多说了. [bx+idata] 这样写是可以的,某些情况下,比较方便. [bx+idata] 也可以写成 idata[bx] 直接见例子: 把'ABcde' 跟 'fGHig' 都改成大写(ASCII中大写字母与小写字母二进制中,只有第五位不同,大写字母是0,小写字母是1) assume cs:code,ds:data d

汇编入门学习笔记 (八)—— 转移指令

疯狂的暑假学习之  汇编入门学习笔记 (八)--  转移指令 參考: <汇编语言> 王爽 第9章 能够改动ip或者同一时候改动cs和ip的指令统称为转移指令. 8086CPU转移行为分为: 段内转移:仅仅改动ip 段间转移:同一时候改动cs和ip 段内转移按ip改动的范围可分为: 短转移:ip改动范围 -128~127 近转移:ip改动范围 -32768~32767 转移指令分为: 无条件转移指令.如 jmp 条件转移指令 循环指令.如 loop 过程. 中断. 1. offset,nop指令

Hadoop入门学习笔记---part3

2015年元旦,好好学习,天天向上.良好的开端是成功的一半,任何学习都不能中断,只有坚持才会出结果.继续学习Hadoop.冰冻三尺,非一日之寒! 经过Hadoop的伪分布集群环境的搭建,基本对Hadoop有了一个基础的了解.但是还是有一些理论性的东西需要重复理解,这样才能彻底的记住它们.个人认为重复是记忆之母.精简一下: NameNode:管理集群,并且记录DataNode文件信息: SecondaryNameNode:可以做冷备份,对一定范围内的数据作快照性备份: DataNode:存储数据: