「json解析」Json解析及解析原理

json解析

1、JSON介绍

JSON（javaScript Object Notation），类似于XML，是一种数据交换格式，相比之下，它比XML表达起来更简单。虽然它源自于JavaScript，但是只是一种数据格式，可以用于任何编程语言。

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

JSON的规则很简单：对象是一个无序的 “ ‘名称/值’ 对” 集合。一个对象以“{”（左括号）开始，“}”（右括号）结束。每个“名称”后跟一个“:”（冒号）；“‘名称/值’ 对”之间使用“,”（逗号）分隔。

必读延伸阅读：

【1-JavaScript编程】6-JavaScript对象 literals之对象字面量（笔记内跳转）
【1-JavaScript编程】6-JavaScript对象 literals之对象字面量（外链共享）

2、JSON的数据结构

null: 表示为 null
boolean: 表示为 true 或 false
number: 一般的浮点数表示方式
string: 表示为 "..."
array: 表示为 [ ... ]
object: 表示为 { ... }

2.1 array

跟Java中普通意义上的数组类似，一般形式如下：

['arr1','arr2','arr3'];

图中的value可以是：

2.2 object

以键值对的形式出现，key和value之间用“：”隔开，两个键值对之间用“，”隔开，一般表示形式如下：

{'key1':'value1','key2':'value2'}

你可以理解为这个Object就是一个Map，下面是一个简单的JSON范例：

<span style="color:black"><span style="color:inherit">{</span></span>

<span style="color:black"><span style="color:inherit">  <span style="color:#aa1111">"orderID"</span>: <span style="color:#116644">12345</span>, </span></span>

<span style="color:black"><span style="color:inherit">  <span style="color:#aa1111">"shopperName"</span>: <span style="color:#aa1111">"John Smith"</span>,</span></span>

<span style="color:black"><span style="color:inherit">  <span style="color:#aa1111">"shopperEmail"</span>: <span style="color:#aa1111">"johnsmith@example.com"</span>,</span></span>

<span style="color:black"><span style="color:inherit">  <span style="color:#aa1111">"contents"</span>: [</span></span>

<span style="color:black"><span style="color:inherit">    {</span></span>

<span style="color:black"><span style="color:inherit">      <span style="color:#aa1111">"productID"</span>: <span style="color:#116644">34</span>,</span></span>

<span style="color:black"><span style="color:inherit">      <span style="color:#aa1111">"productName"</span>: <span style="color:#aa1111">"SuperWidget"</span>,</span></span>

<span style="color:black"><span style="color:inherit">      <span style="color:#aa1111">"quantity"</span>: <span style="color:#116644">1</span></span></span>

<span style="color:black"><span style="color:inherit">    },</span></span>

<span style="color:black"><span style="color:inherit">    {</span></span>

<span style="color:black"><span style="color:inherit">      <span style="color:#aa1111">"productID"</span>: <span style="color:#116644">56</span>,</span></span>

<span style="color:black"><span style="color:inherit">      <span style="color:#aa1111">"productName"</span>: <span style="color:#aa1111">"WonderWidget"</span>,</span></span>

<span style="color:black"><span style="color:inherit">      <span style="color:#aa1111">"quantity"</span>: <span style="color:#116644">3</span></span></span>

<span style="color:black"><span style="color:inherit">    }</span></span>

<span style="color:black"><span style="color:inherit">  ],</span></span>

<span style="color:black"><span style="color:inherit">  <span style="color:#aa1111">"orderCompleted"</span>: <span style="color:#221199">true</span></span></span>

<span style="color:black"><span style="color:inherit">}</span></span>

3、JSON与XML的互相比较

3.1 简单的XML

XML：

<span style="color:black"><span style="color:inherit"><span style="color:#117700"><</span><span style="color:#117700">person</span><span style="color:#117700">></span>  </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#117700"><</span><span style="color:#117700">name</span><span style="color:#117700">></span>xiaoMing<span style="color:#117700"></</span><span style="color:#117700">name</span><span style="color:#117700">></span>   </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#117700"><</span><span style="color:#117700">age</span><span style="color:#117700">></span>20<span style="color:#117700"></</span><span style="color:#117700">age</span><span style="color:#117700">></span>  </span></span>

<span style="color:black"><span style="color:inherit"><span style="color:#117700"></</span><span style="color:#117700">person</span><span style="color:#117700">></span></span></span>

JSON：

<span style="color:black"><span style="color:inherit">{</span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#aa1111">"name"</span>:<span style="color:#aa1111">"xiaoMing"</span>, </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#aa1111">"age"</span>:<span style="color:#116644">20</span></span></span>

<span style="color:black"><span style="color:inherit">}</span></span>

3.2 复杂的XML

XML：

<span style="color:black"><span style="color:inherit"><span style="color:#117700"><</span><span style="color:#117700">section</span><span style="color:#117700">></span>  </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#117700"><</span><span style="color:#117700">title</span><span style="color:#117700">></span>BOOK<span style="color:#117700"></</span><span style="color:#117700">title</span><span style="color:#117700">></span>   </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#117700"><</span><span style="color:#117700">signing</span><span style="color:#117700">></span>  </span></span>

<span style="color:black"><span style="color:inherit">        <span style="color:#117700"><</span><span style="color:#117700">author</span> <span style="color:#0000cc">name</span>=<span style="color:#aa1111">"author-1"</span><span style="color:#117700">/></span>  </span></span>

<span style="color:black"><span style="color:inherit">        <span style="color:#117700"><</span><span style="color:#117700">book</span> <span style="color:#0000cc">title</span>=<span style="color:#aa1111">"book1"</span> <span style="color:#0000cc">price</span>=<span style="color:#aa1111">"$11"</span><span style="color:#117700">/></span>  </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#117700"></</span><span style="color:#117700">signing</span><span style="color:#117700">></span>  </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#117700"><</span><span style="color:#117700">signing</span><span style="color:#117700">></span>  </span></span>

<span style="color:black"><span style="color:inherit">        <span style="color:#117700"><</span><span style="color:#117700">author</span> <span style="color:#0000cc">name</span>=<span style="color:#aa1111">"author-2"</span><span style="color:#117700">/></span>  </span></span>

<span style="color:black"><span style="color:inherit">        <span style="color:#117700"><</span><span style="color:#117700">book</span> <span style="color:#0000cc">title</span>=<span style="color:#aa1111">"book2"</span> <span style="color:#0000cc">price</span>=<span style="color:#aa1111">"$22"</span><span style="color:#117700">/></span>  </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#117700"></</span><span style="color:#117700">signing</span><span style="color:#117700">></span>  </span></span>

<span style="color:black"><span style="color:inherit"><span style="color:#117700"></</span><span style="color:#117700">section</span><span style="color:#117700">></span>  </span></span>

JSON：

<span style="color:black"><span style="color:inherit">"section":{   </span></span>

<span style="color:black"><span style="color:inherit">        "title":"BOOK",  </span></span>

<span style="color:black"><span style="color:inherit">        "signing":[  </span></span>

<span style="color:black"><span style="color:inherit">        {  </span></span>

<span style="color:black"><span style="color:inherit">            "author":  </span></span>

<span style="color:black"><span style="color:inherit">            {  </span></span>

<span style="color:black"><span style="color:inherit">                "name":"author-1"  </span></span>

<span style="color:black"><span style="color:inherit">            },  </span></span>

<span style="color:black"><span style="color:inherit">            "book":  </span></span>

<span style="color:black"><span style="color:inherit">            {  </span></span>

<span style="color:black"><span style="color:inherit">                "title":"book1",  </span></span>

<span style="color:black"><span style="color:inherit">                "price":"$11"  </span></span>

<span style="color:black"><span style="color:inherit">            }  </span></span>

<span style="color:black"><span style="color:inherit">        },  </span></span>

<span style="color:black"><span style="color:inherit">        {  </span></span>

<span style="color:black"><span style="color:inherit">            "author":  </span></span>

<span style="color:black"><span style="color:inherit">            {  </span></span>

<span style="color:black"><span style="color:inherit">                "name":"author-2"  </span></span>

<span style="color:black"><span style="color:inherit">            },  </span></span>

<span style="color:black"><span style="color:inherit">            "book":  </span></span>

<span style="color:black"><span style="color:inherit">            {  </span></span>

<span style="color:black"><span style="color:inherit">                "title":"book2",  </span></span>

<span style="color:black"><span style="color:inherit">                "price":"$22"  </span></span>

<span style="color:black"><span style="color:inherit">            }  </span></span>

<span style="color:black"><span style="color:inherit">        }]  </span></span>

<span style="color:black"><span style="color:inherit">}  </span></span>

3.3 JSON和XML的优缺点

3.3.1 XML的优缺点

优点：

（1）格式统一，符合标准；

（2）容易与其他系统进行远程交互，数据传输比较方便。

缺点：

（1）XML文件庞大，文件格式复杂，传输占带宽；

（2）服务器端和客户端都需要花费大量代码来解析XML，导致服务器端和客户端代码变得异常复杂且不易维护；

（3）客户端不同浏览器之间解析XML的方式不一致，需要重复编写很多代码；

（4）服务器端和客户端解析XML花费较多的资源和时间。

3.3.2 JSON的优缺点

优点：

（1）数据格式比较简单，易于读写，格式都是压缩的，占用带宽小；

（2）易于解析，客户端JavaScript可以简单的通过eval_r()进行JSON数据的读取；

（3）支持多种语言，包括ActionScript, C, C#, ColdFusion, Java, JavaScript, Perl, PHP, Python, Ruby等服务器端语言，便于服务器端的解析；

（4）在PHP世界，已经有PHP-JSON和JSON-PHP出现了，偏于PHP序列化后的程序直接调用，PHP服务器端的对象、数组等能直接生成JSON格式，便于客户端的访问提取；

（5）因为JSON格式能直接为服务器端代码使用，大大简化了服务器端和客户端的代码开发量，且完成任务不变，并且易于维护。

缺点：

（1）没有xml格式这么推广的深入人心和喜用广泛，没有XML那么通用性；

（2）JSON格式目前在Web Service中推广还属于初级阶段。

4、使用JSON实现数据交换

如果我们想要使用JSON包，则可以下载JSON包的源代码，并将这些代码添加进Eclipse工程中，即可调用；

如果想要看API文档，可以参见：https://github.com/stleary/JSON-java

JSON包中最常用的两个类就是jsonobject和jsonarray，分别表示两种数据结构。

4.1 数据交换原理

JSON作为数据的交换格式，在客户端和服务器端都要有对应的转换过程。

如果是客户端请求数据，那么服务器端就将Java对象先转换成 JSON字符串；
经响应把字符串传到客户端之后，客户端就会接收到这个转换结果；
但JavaScript要求把这个字符串变成对象格式才更方便访问；
所以在客户端的JavaScript代码中又需要将这个JSON字符串变成JavaScript能够识别的对象；
这样就完成了从服务器端的对象到客户端对象的整个转变过程。

同理，如果在客户端填写了数据后想提交给服务器，首先是将客户端数据构造成一个JSON对象字符串，经网络传递到服务器端，服务器端再依据转换规则将JSON字符串变成Java识别的对象。

4.2 Java对象转换为JSON

在服务器端对象的转换过程可以使用官方提供的API，JSONObject和JSONArray分别为对象和数组的转换类型。

使用这两个类型进行对象转换时代码如下，

JSONObject：

<span style="color:black"><span style="color:inherit">Employee emp = <span style="color:#770088">new</span> Employee(<span style="color:#116644">1</span>,“王小贱”，“男”)； </span></span>

<span style="color:black"><span style="color:inherit">JSONObject obj = JSONObject.fromObject(emp);</span></span>

<span style="color:black"><span style="color:inherit">String jsonStr  = obj.toString();</span></span>

JSONArray：

<span style="color:black"><span style="color:inherit">List<Employee> emps = <span style="color:#770088">new</span> ArrayList< Employee >(); </span></span>

<span style="color:black"><span style="color:inherit">    <span style="color:#770088">for</span>(int i=<span style="color:#116644">0</span>;i<<span style="color:#116644">3</span>;i++){</span></span>

<span style="color:black"><span style="color:inherit">        Employee s = <span style="color:#770088">new</span> Employee ();</span></span>

<span style="color:black"><span style="color:inherit">        s.setId(i+<span style="color:#116644">1</span>);</span></span>

<span style="color:black"><span style="color:inherit">        s.setName(<span style="color:#aa1111">"Bear"</span> + i);</span></span>

<span style="color:black"><span style="color:inherit">        s.setGender(“男”);</span></span>

<span style="color:black"><span style="color:inherit">        emps.add(s);</span></span>

<span style="color:black"><span style="color:inherit">    }</span></span>

<span style="color:black"><span style="color:inherit">    JSONArray jsonArr = JSONArray.fromObject(emps);</span></span>

<span style="color:black"><span style="color:inherit">    String jsonStr = jsonArr.toString();</span></span>

4.3 JSON字符串转换成JS对象

当JSON经传输到达客户端时，需要完成JSON到JavaScript对象的转换，

如果使用JS原生的方法进行转换的话，可以使用eval（）方法，但需要在JSON的前后连接上左右圆括号，如：

<span style="color:black"><span style="color:inherit">var  jsonObj = eval(“(“ + json + “)”); </span></span>

（eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。语法：eval(string) ）

为什么要 eval这里要添加('('+json+')') 呢？

原因在于eval本身的问题。由于json是以”{}”的方式来开始以及结束的，在JS中，它会被当成一个语句块来处理，所以必须强制性的将它转换成一种表达式。加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将括号内的表达式（expression）转化为对象，而不是作为语句（statement）来执行。

但是需要注意的是方式eval()方法是动态执行其中字符串（可能是js脚本）的，这样很容易会造成系统的安全问题。所以可以采用一些规避了 eval()的第三方客户端脚本库，如prototype.js里面提供的evalJSON（）方法。通过在页面中引入prototype.js文件后就可以使用这个扩展库。

实现代码如下：

<span style="color:black"><span style="color:inherit"><script type=<span style="color:#aa1111">"text/javascript"</span>     src=<span style="color:#aa1111">"js/prototype-1.6.0.3.js"</span>><<span style="color:#ff5500">/script> </span></span></span>

<span style="color:black"><span style="color:inherit">    <script type=<span style="color:#aa1111">"text/javascript"</span>></span></span>

<span style="color:black"><span style="color:inherit">        <span style="color:#770088">function</span> <span style="color:#0000ff">f1</span>(){</span></span>

<span style="color:black"><span style="color:inherit">            <span style="color:#770088">var</span> <span style="color:#0000ff">xhr</span> = getXhr();</span></span>

<span style="color:black"><span style="color:inherit">            <span style="color:#0055aa">xhr</span>.open(<span style="color:#aa1111">'get'</span>,<span style="color:#aa1111">'quoto.do'</span>,<span style="color:#221199">true</span>);</span></span>

<span style="color:black"><span style="color:inherit">            <span style="color:#0055aa">xhr</span>.onreadystatechange=<span style="color:#770088">function</span>(){</span></span>

<span style="color:black"><span style="color:inherit">                <span style="color:#770088">if</span>(<span style="color:#0055aa">xhr</span>.readyState == <span style="color:#116644">4</span>){</span></span>

<span style="color:black"><span style="color:inherit">                    <span style="color:#770088">var</span> <span style="color:#0000ff">txt</span> = <span style="color:#0055aa">xhr</span>.responsetext;</span></span>

<span style="color:black"><span style="color:inherit">                    <span style="color:#aa5500">//将json字符串转换成javascript对象或者数组</span></span></span>

<span style="color:black"><span style="color:inherit">                    <span style="color:#770088">var</span> <span style="color:#0000ff">arr</span> = <span style="color:#0055aa">txt</span>.evalJSON();</span></span>

<span style="color:black"><span style="color:inherit">}</span></span>

<span style="color:black"><span style="color:inherit">            };</span></span>

<span style="color:black"><span style="color:inherit">            <span style="color:#0055aa">xhr</span>.send(<span style="color:#221199">null</span>);</span></span>

<span style="color:black"><span style="color:inherit">        }</span></span>

<span style="color:black"><span style="color:inherit"><<span style="color:#ff5500">/script></span></span></span>

4.4 JSON数据交换的思维导图

放大一些如下：

5、参考链接

JSON for java入门总结
JSON、使用JSON进行数据交换的基础和原理
JSON 和 XML 优缺点的比较

1. JSON的定义：

一种轻量级的数据交换格式，具有良好的可读和便于快速编写的特性。业内主流技术为其提供了完整的解决方案(有点类似于正则表达式，获得了当今大部分语言的支持)，从而可以在不同平台间进行数据交换。JSON采用兼容性很高的文本格式，同事也具备类似于C语言体系的行为。

2. JSON VS XML

1). JSON和XML的书可读性基本相同；

2). JSON和XML同样拥有丰富的解析手段；

3). JSON相对于XML来讲，数据的体积小；

4). JSON与JavaScript的交互更加方便；

5). JSON对数据的描述性比XML较差；

6). JSON的速度要远远快于XML；

7). JSON数据可使用AJAX进行传输；

8). JSON具有层级结构(值中存在值)

3. JSON语法规则

JSON语法是JavaScript对象表示法语法的子集。

1) 数据在名称/值对中；

2) 数据由逗号分隔；

3) 花括号保存对象；

4) 方括号保存数组

4. JSON值

JSON值可以是：

1) 数字(证书或浮点数)

2) 字符串(在双引号中)

3) 逻辑值(true或false)

4) 数组(在方括号中)

5) 对象(在花括号中)

6) null

5. JSON对象

JSON对象在花括号中书写：

对象可以包含多个名称/值对：

{"firstName":"John", "lastName":"Doe"}

6. json数组

JSON数组在方括号中书写：

数组可包含多个对象：

{

"employees":[

{"firstName":"John", "lastName":"Doe"}

{"firstName":"Anna", "lastName":"Smith"}

{"firstName":"Peter", "lastName":"Jones"}

]

}

7. JSON使用JavaScript

因为JSON使用JavaScript语法，所以无需额外的软件就能处理JavaScript中的JSON。

通过JavaScript，您可以创建一个对象数组，并像这样进行赋值：

var employees = [

{"firstName":"Bill", "lastName":"Gates"}

{"firstName":"George", "lastName":"Bush"}

{"firstName":"Thomas", "lastName":"Carter"}

];

像这样访问JavaScript对象数组中的第一项：

employees[0].lastName;

修改数据：

employees[0].lastName="Jobs";

8. JSON文件

JSON文件的文件类型是".json"

JSON文本的MIME类型是"APPlication/json"

9. 把JSON文本转换为JavaScript对象

JSON最常见的用法之一，是从web服务器上读取JSON数据(作为文件或作为Httprequest)，将JSON数据转换为JavaScript对象，然后在网页中使用该数据。

10. JSON实例-来自字符串的对象

创建包含JSON语法的JavaScript字符串

var txt = '{"employees":['+

' {"firstName":"Bill", "lastName":"Gates"}, ' +

' {"firstName":"George", "lastName":"Bush"}, '+

' {"firstName":"Thomas", "lastName":"Carter"} ]}';

由于JSON语法是JavaScript语法的子集，JavaScript函数eval()可用于将JSON文本转换为JavaScript对象。

eval()函数使用的是JavaScript编译器，可解析JSON文本，然后生成JavaScript对象。必须把文本包围在括号中，这样才能避免语法错误：

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

11. JSON解析器

提示：eval()函数可编译并执行任何JavaScript代码。这隐藏了一个潜在的安全问题。

使用JSON解析器将JSON转换为JavaScript对象是更安全的做法。JSON解析器只能识别JSON文本，而不会编译脚本。

在浏览器中，这提供了原生的JSON支持，而且JSON解析器的速度更快。

较新的浏览器和ECMAScript(JavaScript)标准中均包含了原生的对JSON的支持。

Web浏览器支持

Web软件支持

FireFox(Mozilla) 3.5

Internet Explorer 8

Chrome

Opera 10

Safari 4　

JQUery

Yahoo UI

Prototype

Dojo

ECMAScript 1.5

Json解析及解析原理