JSON 入门指南

《JSON 入门指南》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、JSON入门指南简介： JSON即JavaScriptObjectNatation，它是一种轻量级的数据交换格式，非常适合于服务器与JavaScript的交互。本文将快速讲解JSON格式，并通过代码示例演示如何分别在客户端和服务器端进行JSON格式数据的处理。尽管有许多宣传关于XML如何拥有跨平台，跨语言的优势，然而，除非应用于WebServices，否则，在普通的Web应用中，开发者经常为XML的解析伤透了脑筋，无论是服务器端生成或处理XML，还是客户端用JavaScript解析XML，都常常导致复杂的代码，极低的开发效率。实际

2、上，对于大多数Web应用来说，他们根本不需要复杂的XML来传输数据，XML的扩展性很少具有优势，许多AJAX应用甚至直接返回HTML片段来构建动态Web页面。和返回XML并解析它相比，返回HTML片段大大降低了系统的复杂性，但同时缺少了一定的灵活性。现在，JSON为Web应用开发者提供了另一种数据交换格式。让我们来看看JSON到底是什么，同XML或HTML片段相比，JSON提供了更好的简单性和灵活性。Ajax资源中心请访问 Ajax资源中心，这是有关Ajax编程模型信息的一站式中心，包括很多文档、教程、论坛、blog、wiki和新

3、闻。任何Ajax的新信息都能在这里找到。JSON数据格式解析和XML一样，JSON也是基于纯文本的数据格式。由于JSON天生是为JavaScript准备的，因此，JSON的数据格式非常简单，您可以用JSON传输一个简单的String，Number，Boolean，也可以传输一个数组，或者一个复杂的Object对象。String，Number和Boolean用JSON表示非常简单。例如，用JSON表示一个简单的String“abc”，其格式为："abc"除了字符 "，，/ 和一些控制符（b，f，，r，t）需要编码外，其

4、他Unicode字符可以直接输出。下图是一个String的完整表示结构：图1.String的完整表示结构 8 一个Number可以根据整型或浮点数表示如下：图2.Number的表示结构  这与绝大多数编程语言的表示方法一致，例如：812345（整数）-3.9e10（浮点数）Boolean类型表示为 true 或 false 。此外，JavaScript中的null被表示为 null，注意，true、false 和 null 都没有双引号，否则将被视为一个String。JSON还可以表示一个数组对象，使用 [] 包含所有元素，每个元

5、素用逗号分隔，元素可以是任意的Value，例如，以下数组包含了一个String，Number，Boolean和一个null：["abc",12345,false,null]Object对象在JSON中是用 {} 包含一系列无序的Key-Value键值对表示的，实际上此处的Object相当于Java中的 Map，而不是Java的Class。注意Key只能用String表示。例如，一个Address对象包含如下Key-Value：city:Beijingstreet:ChaoyangRoadpostcod

6、e:100025（整数）用JSON表示如下：{"city":"Beijing","street":"ChaoyangRoad","postcode":100025}其中Value也可以是另一个Object或者数组，因此，复杂的Object可以嵌套表示，例如，一个Person对象包含name和address对象，可以表示如下：{"name":"Michael","address":{"city":"Beijing","street":"ChaoyangRoad","postcode":100025}}JavaScript处理JSON

7、数据上面介绍了如何用JSON表示数据，接下来，我们还要解决如何在服务器端生成JSON格式的数据以便发送到客户端，以及客户端如何使用JavaScript处理JSON格式的数据。我们先讨论如何在Web页面中用JavaScript处理JSON数据。我们通过一个简单的JavaScript方法就能看到客户端如何将JSON数据表示给用户：8functionhandleJson(){varj={"name":"Michael","address":{"city":"Beijing","street":"ChaoyangRoad","postco

8、de":100025}};document.write(j.name);document.write(j.address.city);}假定服务器返回的JSON数据是上文的：{"name":"Michael","address":{"city":"