json

最新推荐文章于 2024-09-26 17:23:32 发布

roger_lmj

最新推荐文章于 2024-09-26 17:23:32 发布

阅读量1k

点赞数

分类专栏： JS/Ajax/Jquery/as 文章标签： json javascript xmlhttprequest string object 服务器

JS/Ajax/Jquery/as 专栏收录该内容

36 篇文章 0 订阅

订阅专栏

格式定义非常简单，就是通过一组键值对来定义一个对象。
你可以直接将这种格式的数据赋值给一个变量，然后通过键名取值。相对于使用xml来作为数据交换格式，如果要在javascript里使用，首先需要创建一个DOMParser，然后通过DOM接口访问节点对象，非常繁琐，更不用说不同浏览器的实现中DOMParser的实现和DOM接口都有诸多不同。为什么大量的AJAX应用中宁可直接返回一个HTML片断而不是直接把 XML交给javascript处理，一个主要原因就是处理XML的过程比较复杂。JSON最重要的贡献就是简化了解析数据的过程。
del.icio.us提供的在网页上显示书签的javascript脚本就基于JSON，看一下这个脚本，再设想一下通过AJAX读取del.icio.us提供的RSS接口来实现这个功能，就能体会JSON的巧妙了。
除此之外，更有人提出类似XSLT的 JSONT ，可以将JSON格式的内容转换成其他形式，虽然还暂时还没有XSLT灵活和强大，至少展示了一种可能性。(文章来源 www.iocblog.net)
JSON解决的另一个传统AJAX中xmlhttprequest不能解决的问题就是跨域链接的问题。基于安全考虑，各种浏览器缺省都不允许 xmlhttprequest跨域名链接，abc.com页面上的xmlhttprequest是无法连接def.com的内容的。在网页中，JSON可以采用引入script元素的方式导入数据，html中的script可以指定非本地脚本，跨域链接的问题得以解决。但使用这样的方式导入JSON数据，是一个同步的过程（是否可以用defer属性来实现异步？），这点上不如xmlhttpreqeust灵活。
JSON运行信赖包文件如下：
ezmorph-1.0.1.jar http://ezmorph.sourceforge.net/
http://jakarta.apache.org/commons/index.html
commons-beanutils.jar
commons-httpclient.jar
commons-lang.jar
commons-logging.jar

JSON定义
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式，易于阅读和编写，同时也易于机器解析和生成。它基于ECMA262语言规范（1999-12第三版）中JavaScript 编程语言的一个子集。 JSON采用与编程语言无关的文本格式，但是也使用了类C语言（包括C， C++， C#， Java， JavaScript， Perl， Python等）的习惯，这些特性使JSON成为理想的数据交换格式。
［只是一种数据交换用的语言而已的哦！］
JSON的结构基于下面两点

1. "名称/值"对的集合 不同语言中，它被理解为对象(object)，记录(record)，结构(struct)，字典(dictionary)，哈希表(hash table)，键列表(keyed list)等
2. 值的有序列表 多数语言中被理解为数组(array)

其也是有自己的语言格式的哦！
JSON以一种特定的字符串形式来表示 JavaScript 对象。如果将具有这样一种形式的字符串赋给任意一个 JavaScript 变量，那么该变量会变成一个对象引用，而这个对象就是字符串所构建出来的，好像有点拗口，我们还是用实例来说明。

这里假设我们需要创建一个User对象，并具有以下属性

用户ID
用户名
用户Email
您可以使用以下JSON形式来表示User对象：
```
{"UserID":11, "Name":"Truly", "Email":"zhuleipro◎hotmail.com"};
```
然后如果把这一字符串赋予一个JavaScript变量，那么就可以直接使用对象的任一属性了。(文章来源 www.iocblog.net)

完整代码:
实际使用时可能更复杂一点，比如我们为Name定义更详细的结构，使它具有FirstName和LastName：
```
{"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"}
```
完整代码:
现在我们增加一个新的需求，我们某个页面需要一个用户列表，而不仅仅是一个单一的用户信息，那么这里就需要创建一个用户列表数组。
下面代码演示了使用JSON形式定义这个用户列表：
```
[

{"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"},

{"UserID":12, "Name":{"FirstName":"Jeffrey","LastName":"Richter"}, "Email":"xxx◎xxx.com"},

{"UserID":13, "Name":{"FirstName":"Scott","LastName":"Gu"}, "Email":"xxx2◎xxx2.com"}

]
```
完整代码:
事实上除了使用"."引用属性外，我们还可以使用下面语句：
```
alert(UserList[0]["Name"]["FirstName"]); 或者 alert(UserList[0].Name["FirstName"]); 
```
现在读者应该对JSON的使用有点认识了，归纳为以下几点：
对象是属性、值对的集合。一个对象的开始于“{”，结束于“}”。每一个属性名和值间用“:”提示，属性间用“,”分隔。
数组是有顺序的值的集合。一个数组开始于"["，结束于"]"，值之间用","分隔。
值可以是引号里的字符串、数字、true、false、null，也可以是对象或数组。这些结构都能嵌套。
字符串和数字的定义和C或Java基本一致。
小节：

本文通过一个实例演示，初步了解了JSON 的强大用途。可以归结如下：
JSON 提供了一种优秀的面向对象的方法，以便将元数据缓存到客户机上。
JSON 帮助分离了验证数据和逻辑。
JSON 帮助为 Web 应用程序提供了 Ajax 的本质。
参考资料：
http://www.json.org/

对象及数组分开是这样来定义的哦！
通过｛｝及［］来分别定义
属性名与值之间是用：提示，属性之间用，分隔的哦！
Ajax对象来传递信息，可以读作“Jason”

AJAX中可以不用XML了哈哈，直接用JS中自身的对象来处理的哦！
JSON概念很简单，就是服务器直接生成 JavaScript语句，客户端获取后直接用eval方法来获得这个对象，
［可以说是在服务器直接生成了JS语句然后客户端通过eval命令得到这个对象之后就可以利用这个对象了！］
这样就可以省去解析XML的性能损失。比如传递Blog评论的示例：
使用XML表示：

<comments>
<comment>
  <id>1</id>
  <author>someone1</author>
  <url>http://someone1.x2design.net</url>
  <content>hello</content>
</comment>
<comment>
  <id>2</id>
  <author>someone2</author>
  <url>http://someone2.x2design.net</url>
  <content>someone1</content>
</comment>
<comment>
  <id>3</id>
  <author>someone3</author>
  <url>http://someone3.x2design.net</url>
  <content>hello</content>
</comment>
</comments>

使用JSON：
分析一下这个对象：｛｝
{comments:[{},{},{}]};对象之间是通过,进行分隔开的哦！

{comments:[
{
  id:1,
  author:"someone1",
  url:"http://someone1.x2design.net",
  content:"hello"
},
{
  id:2,
  author:"someone2",
  url:"http://someone2.x2design.net",
  content:"hello"
},
{
  id:3,
  author:"someone3",[www.iocblog.net 来源]
  url:"http://someone3.x2design.net",
  content:"hello"
}
]};

很容易发现，使用JSON不仅减少了解析XML解析带来的性能问题和兼容性问题，而且对于JavaScript来说非常容易使用，可以方便的通过遍历数组以及访问对象属性来获取数据，其可读性也不错，基本具备了结构化数据的性质。不得不说是一个很好的办法，
而且事实上google maps就没有采用XML传递数据，而是采用了JSON方案。

JSON的另外一个优势是跨域可行性，例如你在www.xxx.com的网页里使用是完全可行的，这就意味着你可以跨域传递信息。而使用XMLHttpRequest却获取不了跨域的信息，这是JavaScript内部的安全性质所限制的。

JSON看上去很美，是不是就能完全取代XML呢？事实并非如此，而原因就在于XML的优势：通用性。要使服务器端产生语法合格的JavaScript代码并不是很容易做到的，这主要发生在比较庞大的系统，服务器端和客户端有不同的开发人员。它们必须协商对象的格式，这很容易造成错误。
无论如何，JSON是一个诱人的技术，准备在X2Blog做一个大量的试用。希望届时可以获取大的性能提高。
［可以尝试玩一下用JSON+JS实现新的AJAX技术吧！］

很多资料上都说JSON在更多的场合都比XML更适合Ajax的数据传送,但google很久没有找到JSON的如何像XML那样的遍历，其实JSON是一种JS定义对象的一种特殊的形势,所以可以按照对象的方法来访问,但又有一些不同.JSON太神奇了,呵呵,做了个小例子,不知道如何读取JSON中的值的朋友看一下吧！

[来源www.iocblog.net]

此外,如果服务器返回得responseText内容是{"msg":[{"user":"llinzzi","msg":"你好"},{"user": "Huanhuan","msg":"嘿嘿"}],"type":"test"}格式的,在ajax要进行赋值的时候必须是
var msg=eval('(' + req.responseText + ')');
[来源www.iocblog.net]

？现在要想一个问题就是服务器端如何生成JSON呢？

和 XML 一样，JSON 也是基于纯文本的数据格式。由于 JSON 天生是为 JavaScript 准备的，因此，JSON 的数据格式非常简单，您可以用 JSON 传输一个简单的 String，Number，Boolean，也可以传输一个数组，或者一个复杂的 Object 对象。

String，Number 和 Boolean 用 JSON 表示非常简单。例如，用 JSON 表示一个简单的 String “ abc ”，其格式为：

abc"

除了字符 " ，/ ，/ 和一些控制符（/b ，/f ，/n ，/r ，/t ）需要编码外，其他 Unicode 字符可以直接输出。下图是一个 String 的完整表示结构
可以传递字符串及数组形式的东西！
Boolean 类型表示为 true 或 false 。此外，JavaScript 中的 null 被表示为 null ，注意，true 、false 和 null 都没有双引号，否则将被视为一个 String 。
JSON 还可以表示一个数组对象，使用 [] 包含所有元素，每个元素用逗号分隔，元素可以是任意的 Value，例如，以下数组包含了一个 String，Number，Boolean 和一个 null：

["abc",12345,false,null]

它的数据类型其实与其他语言的很相似的哦！包含了基本数据类型及对象类型！

Object 对象在 JSON 中是用 {} 包含一系列无序的 Key-Value 键值对表示的，实际上此处的 Object 相当于 Java 中的 Map<String, Object> ，而不是 Java 的 Class 。注意 Key 只能用 String 表示。对象是用｛｝表示的哦！相当于Map正是所谓的名值对应关系啊！

例如，一个 Address 对象包含如下 Key-Value：

city:Beijing street:Chaoyang Road postcode:100025（整数）

用 JSON 表示如下：

{"city":"Beijing","street":" Chaoyang Road ","postcode":100025}

其中 Value 也可以是另一个 Object 或者数组，因此，复杂的 Object 可以嵌套表示，例如，一个 Person 对象包含 name 和 address 对象，可以表示如下：

{"name":"Michael","address":

 {"city":"Beijing","street":" Chaoyang Road ","postcode":100025}

}

其实一个名所对应的值也可以是一个对象的哦！

{"name":"Michael","address":{"city":"beijing","street":"chong road"}}这里面的一个值就是一个对象了！

1.如何用JS来处理JSON呢？

function handleJson() { 

 var j={"name":"Michael","address":

 {"city":"Beijing","street":" Chaoyang Road ","postcode":100025}

 }; 

 document.write(j.name); 

 document.write(j.address.city); 

 }

可以变量J就是一个JSON对象了。包括了值又是一个对象

假定服务器返回的 JSON 数据是上文的：

{"name":"Michael","address":

 {"city":"Beijing","street":" Chaoyang Road ","postcode":100025}



}

只需将其赋值给一个 JavaScript 变量，就可以立刻使用该变量并更新页面中的信息了，相比 XML 需要从 DOM 中读取各种节点而言，JSON 的使用非常容易。我们需要做的仅仅是发送一个 Ajax 请求，然后将服务器返回的 JSON 数据赋值给一个变量即可。有许多 Ajax 框架早已包含了处理 JSON 数据的能力，例如 Prototype（一个流行的 JavaScript 库：http://prototypejs.org）提供了 evalJSON() 方法，能直接将服务器返回的 JSON 文本变成一个 JavaScript 变量：

new Ajax.Request("http://url", { method: "get", onSuccess: function(transport) { var json = transport.responseText.evalJSON(); // TODO: document.write(json.xxx); } });
客户端要如何来得到这个JSON对象呢？通过内库来用方法哦！
看看在服务器生成JSON呢？
将 String 对象编码为 JSON 格式时，只需处理好特殊字符即可。另外，必须用 (" ) 而非 (' ) 表示字符串：String 中的话要特别注意好特殊字符的处理了！
为了能够控制得好字符串的输出看看如何处理的？

 static String string2Json(String s) { 

 StringBuilder sb = new StringBuilder(s.length()+20); 

 sb.append('/"'); 

 for (int i=0; i<s.length(); i++) { 

 char c = s.charAt(i); 

 switch (c) { 

 case '/"': //处理这种特殊字符串哦！

 sb.append("///""); 

 break; 

 case '//': 

 sb.append(""); 

 break; 

 case '/': 

 sb.append("///"); 

 break; 

 case '/b': 

 sb.append("//b"); 

 break; 

 case '/f': 

 sb.append("//f"); 

 break; 

 case '/n': 

 sb.append("//n"); 

 break; 

 case '/r': 

 sb.append("//r"); 

 break; 

 case '/t': 

 sb.append("//t"); 

 break; 

 default: 

 sb.append(c); 

 } 

 } 

 sb.append('/"'); 

 return sb.toString(); 

 }

将 Number 表示为 JSON 就容易得多，利用 Java 的多态，我们可以处理 Integer，Long，Float 等多种 Number 格式：

static String number2Json(Number number) { return number.toString(); }

Boolean 类型也可以直接通过 toString() 方法得到 JSON 的表示：

static String boolean2Json(Boolean bool) { return bool.toString(); }

要将数组编码为 JSON 格式，可以通过循环将每一个元素编码出来：

 static String array2Json(Object[] array) { 

 if (array.length==0) 

 return "[]"; 

 StringBuilder sb = new StringBuilder(array.length << 4); 

 sb.append('['); 

 for (Object o : array) { 

 sb.append(toJson(o)); 

 sb.append(','); 

 } 

 // 将最后添加的 ',' 变为 ']': 

 sb.setCharAt(sb.length()-1, ']'); 

 return sb.toString(); 

 }

最后，我们需要将 Map<String, Object> 编码为 JSON 格式，因为 JavaScript 的 Object 实际上对应的是 Java 的 Map<String, Object> 。该方法如下：

static String map2Json(Map<String, Object> map) { if (map.isEmpty()) return "{}"; StringBuilder sb = new StringBuilder(map.size() << 4); sb.append('{'); Set<String> keys = map.keySet(); for (String key : keys) { Object value = map.get(key); sb.append('/"'); sb.append(key); sb.append('/"'); sb.append(':'); sb.append(toJson(value)); sb.append(','); } // 将最后的 ',' 变为 '}': sb.setCharAt(sb.length()-1, '}'); return sb.toString(); }
告诉了我们如何生成的每一种数据类型，包括字符串数字布尔类型及数组仍至于Map类型。

为了统一处理任意的 Java 对象，我们编写一个入口方法 toJson(Object) ，能够将任意的 Java 对象编码为 JSON 格式：

public static String toJson(Object o) { //可以将对象编码成JSON格式哦！

 if (o==null) 

 return "null"; 

 if (o instanceof String) 

 return string2Json((String)o); 

 if (o instanceof Boolean) 

 return boolean2Json((Boolean)o); 

 if (o instanceof Number) 

 return number2Json((Number)o); 

 if (o instanceof Map) 

 return map2Json((Map<String, Object>)o); 

 if (o instanceof Object[]) 

 return array2Json((Object[])o); 

 throw new RuntimeException("Unsupported type: " + o.getClass().getName()); 

 } 

 已经成功编码成功了JSON了，现在就可以考虑如何从服务器端往客户端输出了哦！

 response.setContentType("application/json;charset=UTF-8"); 

 response.setCharacterEncoding("UTF-8"); 

 PrintWriter pw = response.getWriter(); 

 pw.write(JsonUtil.toJson(obj)); 

 pw.flush(); 

JSON 已经是 JavaScript 标准的一部分。目前，主流的浏览器对 JSON 支持都非常完善。

应用 JSON，我们可以从 XML 的解析中摆脱出来，

对那些应用 Ajax 的 Web 2.0 网站来说，JSON 确实是目前最灵活的轻量级方案。 





（二）

使用 JSON 进行数据的异步传输

JSON （ JavaScript Object Notation）允许轻松地将 JavaScript 对象转换成可以随请求发送的数据（同步或异步都可以）。本文首先介绍 JSON 的数据格式，接着介绍如何在 JavaScript 中使用 JSON ，重点介绍一下如何使用 JSON 完成数据的异步传输。

1． JSON 的数据格式

a) 按照最简单的形式，可以用下面这样的 JSON 表示名称 / 值对：

{ "firstName": "Brett" }

b) 可以创建包含多个名称 / 值对的记录 ，比如：

{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" }

c) 可以创建值的数组

{ "people": [

{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }

]}

d) 当然，可以使用相同的语法表示多个值（每个值包含多个记录） ：

{ "programmers": [

{ "firstName": "Brett", "lastName":"McLaughlin", " email ": "brett@newInstance.com" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }

"authors": [

{ "firstName": "Isaac", "lastName": "Asimov", " genre ": "science fiction" },

{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" }

"musicians": [

{ "firstName": "Eric", "lastName": "Clapton", " instrument ": "guitar" }

]

}

注意，在不同的主条目（ programmers 、 authors 和 musicians ）之间，记录中实际的名称 / 值对可以不一样。 JSON 是完全动态的，允许在 JSON 结构的中间改变表示数据的方式。

2．在 JavaScript 中使用 JSON

JSON 是 JavaScript 原生格式，这意味着在 JavaScript 中处理 JSON 数据不需要任何特殊的 API 或工具包。

2.1 将 JSON 数据赋值给变量

例如，可以创建一个新的 JavaScript 变量，然后将 JSON 格式的数据字符串直接赋值给它：

var people =

{ "programmers": [

{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }

"authors": [

{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },

{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" }

"musicians": [

{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" }

]

}

2.2 访问数据

将这个数组放进 JavaScript 变量之后，就可以很轻松地访问它。实际上，只需用点号表示法来表示数组元素。所以，要想访问 programmers 列表的第一个条目的姓氏，只需在 JavaScript 中使用下面这样的代码：

people . programmers [0]. lastName;

注意，数组索引是从零开始的 。

2.3 修改 JSON 数据

正如访问数据，可以按照同样的方式修改数据：

people . musicians [1]. lastName = "Rachmaninov";

2.4 转换回字符串

a) 在 JavaScript 中这种转换也很简单：

String newJSONtext = people. toJSONString( );

b) 可以将任何 JavaScript 对象转换为 JSON 文本。并非只能处理原来用 JSON 字符串赋值的变量。为了对名为 myObject 的对象进行转换，只需执行相同形式的命令：

String myObjectInJSON = myObject.toJSONString();

说明：将转换回的字符串作为 Ajax调用的字符串，完成异步传输。

小结： 如果要处理大量 JavaScript 对象，那么 JSON 几乎肯定是一个好选择，这样就可以轻松地将数据转换为可以在请求中发送给服务器端程序的格式。

3． 服务器端的 JSON

3.1 将 JSON 发给服务器

a) 通过 GET 以名称 /值对发送 JSON

在 JSON 数据中会有空格和各种字符， Web 浏览器往往要尝试对其继续编译。要确保这些字符不会在服务器上（或者在将数据发送给服务器的过程中）引起混乱，需要在 JavaScript 的 escape()函数中做如下添加：

var url = "organizePeople.php?people=" + escape (people.toJSONString());

request.open(" GET ", url, true);

request.onreadystatechange = updatePage;

request.send(null);

b) 利用 POST 请求发送 JSON 数据

当决定使用 POST 请求将 JSON 数据发送给服务器时，并不需要对代码进行大量更改，如下所示：

var url = "organizePeople.php?timeStamp=" + new Date().getTime();

request.open(" POST ", url, true);

request.onreadystatechange = updatePage;

request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

request.send( people.toJSONString() );

注意：赋值时格式必须是 var msg=eval('(' + req.responseText + ')');

3.2 在服务器上解释 JSON

a) 处理 JSON 的两步骤。

针对编写服务器端程序所用的语言，找到相应的 JSON 解析器 /工具箱 /帮助器 API。

使用 JSON 解析器 /工具箱 /帮助器 API 取得来自客户机的请求数据并将数据转变成脚本能理解的东西。

b) 寻找 JSON 解析器

寻找 JSON 解析器或工具箱最好的资源是 JSON 站点。如果使用的是 Java servlet ， json.org 上的 org.json 包就是个不错的选择。在这种情况下，可以从 JSON Web 站点下载 json.zip 并将其中包含的源文件添加到项目构建目录。编译完这些文件后，一切就就绪了。对于所支持的其他语言，同样可以使用相同的步骤；使用何种语言取决于您对该语言的精通程度，最好使用您所熟悉的语言。