使用JSON

JSON也就是JavaScript Object Notation,是一个描述数据的轻量级语法。JSON的优雅是因为它是JavaScript语言的一个子集。接下来你将看到它为什么如此重要。首先,来比较一下JSON和XML语法。

JSON和XML都使用结构化方法描述数据。例如一个地址簿应用程序可以提供用来产生XML格式的地址卡的web服务:

<?xml version='1.0' encoding='UTF-8'?>
 <card>
 <fullname>Sean Kelly</fullname>
 <org>SK Consulting</org>
 <emailaddrs>
 <address type='work'>kelly@5icool.org</address>
 <address type='home' pref='1'>kelly@5icool.org</address>
 </emailaddrs>
 <telephones>
 <tel type='work' pref='1'>+1 214 555 1212</tel>
 <tel type='fax'>+1 214 555 1213</tel>
 <tel type='mobile'>+1 214 555 1214</tel>
 </telephones>
 <addresses>
 <address type='work' format='us'>1234 Main St
    Springfield, TX 78080-1216</address>
 <address type='home' format='us'>5678 Main St
    Springfield, TX 78080-1316</address>
 </addresses>
 <urls>
 <address type='work'>http://www.5icool.org/</address>
 <address type='home'>http://www.5icool.org/</address>
 </urls>
 </card>

使用JSON, 形式如下:

{
    "fullname": "Sean Kelly",
    "org": "SK Consulting",
    "emailaddrs": [
    {"type": "work", "value": ""},
    {"type": "home", "pref": 1, "value": ""}
    ],
    "telephones": [
    {"type": "work", "pref": 1, "value": "+1 214 555 1212"},
    {"type": "fax", "value": "+1 214 555 1213"},
    {"type": "mobile", "value": "+1 214 555 1214"}
    ],
    "addresses": [
    {"type": "work", "format": "us",
    "value": "1234 Main StnSpringfield, TX 78080-1216"},
    {"type": "home", "format": "us",
    "value": "5678 Main StnSpringfield, TX 78080-1316"}
    ],
    "urls": [
    {"type": "work", "value": "http://www.5icool.org/"},
    {"type": "home", "value": "http://www.5icool.org/"}
    ]
    }

如你所看到的,JSON有结构化的嵌套数据元素,这一点和XML相似。JSON也是基于文本的,XML也是如此。两者都使用Unicode。 JSON和XML都很容易阅读。主观上,JSON更清晰,冗余更少。JSON WEB站点严格地描述了JSON语法,目前就是这样的。它确实是一个简单的小语言! XML确实适合标记文档,但是JSON是数据交互的理想格式。每个JSON文档描述了一个这样一个对象,该对象包含有:嵌套对象、数组、字符串、数字、布 尔值或空值。

在这些地址卡例子代码中,JSON版本是更轻量级的,只占用了682字节的空间,而XML版本需要744字节空间。尽管这不是一个可观的节省。而实际的好处则来自解析过程。

XML对比JSON:地位丧失

通过使用XMLHttpRequest对象,可以从你的基于AJAX的应用程序取得XML和JSON文件。典型的,交互代码如下:

var req = new XMLHttpRequest();
     req.open("GET", "http://www.5icool.org/addr?cardID=32", /*async*/true);
     req.onreadystatechange = myHandler;
     req.send(/*no params*/null);

作为WEB服务器响应,你提供的处理器函数(myHandler函数)被多次调用,为你提供提前终止事务,更新进度条等机会。通常的,只有在web请求完成以后才起作用:那时,你就可以使用返回的数据了。

为了处理XML版本的地址卡数据,myHandler的代码如下:

function myHandler() {
    if (req.readyState == 4 /*complete*/) {
    // Update address field in a form with first street address
    var addrField   = document.getElementById('addr');
    var root        = req.responseXML;
    var addrsElem   = root.getElementsByTagName('addresses')[0];
    var firstAddr   = addrsElem.getElementsByTagName('address')[0];
    var addrText    = fistAddr.firstChild;
    var addrValue   = addrText.nodeValue;
    addrField.value = addrValue;
    }
    }

值得注意的是你不必解析XML文档:XMLHttpRequest对象自动地解析了,并使responseXML中的DOM树可用。通过使用 responseXML属性,可以调用getElementsByTagName方法查找文档的地址部分,你还可以使用第一个去找到它。然后,可以再次调 用getElementsByTagName在地址部分查找第一个地址元素。这就取得了文档的第一个DOM子节点,就是一个文本节点,并取得节点的值,这 就是你想要的街道地址。最后,可以在表单域中显示结果。

确实不是一个简单的工作,现在,使用JSON再试一下:

function myHandler() {
    if (req.readyState == 4 /*complete*/) {
    var addrField = document.getElementById('addr');
    var card = eval('(' + req.responseText + ')');
    addrField.value = card.addresses[0].value;
    }
    }

你所做的第一件事情就是解析JSON响应。但是,因为JSON是JavaScript的一个子集,你可以使用JavaScript自己的编译器来解析它, 通过调用eval函数。解析JSON仅需要一行!此外,操纵JSON中的对象就像操纵其他JavaScript对象一样。这显然要比通过DOM树来操纵简 单,例如:

card.addresses[0].value 是第一个街道地址, "1234 Main Stb &" 
   card.addresses[0].type 是地址类型, "work" 
   card.addresses[1] 是家庭地址对象 
   card.fullname 是card的名称, "Sean Kelly" 

如果更仔细观察,你可能会发现XML格式中文档至少有一个跟元素,card。这在JSON里是不存在的,为什么? 大概就是,如果你正在开发JavaScript来访问Web服务,你已经知道你想要得到的。然而,你可以在JSON中这么使用:

{"card": {"fullname": ...}}

使用这个技术,你的JSON文件总是以一个带有单一命名属性的对象开始,该属性标识了对象的种类。

JSON是快速可靠的吗?

JSON提供轻量的小文档,并且JSON在JavaScript更容易使用。XMLHttpRequest自动为你解析了XML文档,而你还要手工解析 JSON文件,但是解析JSON比解析XML更慢么?作者通过几千次的反复测试,使用XMLHttpRequest解析XML和解析JSON,结果是解析 JSON比XML要快10倍!当把AJAX当作桌面应用看待时,速度是最重要的因素,很明显,JSON更优秀。

当然,你不能总是控制服务器端来为AJAX程序产生数据。你还可以使用第三方服务器代替服务器提供XML格式的输出。并且,如果服务器恰好提供JSON,你可以确定你真的想使用它吗?

代码中值得注意的是,你将响应文本直接传入到eval中。如果你控制着服务器,就可以这么做。如果不是,一个恶意服务器可以使你的浏览器执行危险操作。在这样的情况下,你最好使用写在JavaScript中的代码来解析JSON。幸运地,这已经有了。

说到解析,Python爱好者可能注意到JSON不只是JavaScript的子集,它还是Python的一个子集。你可以在Python中直接执行JSON,或者使用安全JSON解析代替。JSON.org网站列举了许多常用JSON解析器

服务器端的JSON

到现在为止,你或许将焦点注意在运行在客户浏览器中的基于AJAX的web应用程序使用JSON。自然地,首先,JSON格式的数据必须在服务器端产生。 幸运地是,创建JSON或将其他存在的数据转换成JSON是相当简单的。一些WEB应用程序框架,例如TurboGears,自动包括对JSON输出的支 持。

此外商业WEB服务提供商也注意到了JSON。Yahoo最近创建了许多基于JSON的web服务。Yahoo的多种搜索服务,履行计 划,del.icio.us,还有高速公路交通服务也都支持JSON输出。毫无疑问,其他主要WEB服务提供商也将加入到对JSON的支持中。

总结

JSON的聪明在于它是JavaScript和Python的子集,使得它更易用,为AJAX提供高效的数据交互。它解析更快,比 XML更易使用。JSON正成为现在“Web 2.0”的最强音。每个开发者,无论是标准桌面应用程序或Web应用程序,越来越注意到了它的简单和便捷。我希望你能体会到在buzzword- compliant, Web-2.0-based, AJAX-enabled, 敏捷开发中应用到JSON的乐趣。

json 使用 (下)的更多相关文章

  1. Java Json 数据下划线与驼峰格式进行相互转换

    概述 今天遇见一个需求,需要对json数据进行下划线与驼峰格式之间进行转换,在Fastjson.Jackson.Gson都提供了转换的方式,在这里进行一下列举. User类: public class ...

  2. json ubuntu下安装

    1.首先安装scons scons是linux下的自动构建工具,类似cmake. 下载地址wget http://prdownloads.sourceforge.net/scons/scons-2.2 ...

  3. Select级联菜单,用Ajax获取Json绑定下拉框(jQuery)

    需求类似这样  ↓ ↓ ↓   -->    菜单A发生变化,动态取数据填充下拉菜单B. JS代码如下: <script type="text/javascript"& ...

  4. JSON做下拉表格

    主页面,5-18j.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...

  5. org.json库下的json的基本使用

    public class Users { private String username; private String password; public String getUsername() { ...

  6. 使用Javascript Ajax 通信操作JSON数据 [下]

    上一篇文章我们获得后台数据库的数据后转换成json格式然后返回到前台,但只是返回的一位数组,这次我们返回二维和三维数组和对象. 前台代码shizhan.html: <!DOCTYPE html& ...

  7. flask json 格式下 decimal 不是正确格式的问题

    import decimal class DecimalEncoder(json.JSONEncoder): def default(self, o): if isinstance(o, decima ...

  8. 测试json字符和java对象属性不一样在多个json框架下转换的表现

    package com.longge.mytest; import java.io.IOException; import org.junit.Test; import com.alibaba.fas ...

  9. .NET下 JSON 的一些常用操作

    1.JSON的序列化和反序列化 Newtonsoft.Json dll 下载地址http://json.codeplex.com/ using System; using System.Collect ...

  10. JSON入门指南--客户端处理JSON

    在传统的Web开发过程中,前端工程师或者后台工程师会在页面上写后台的相关代码,比如在ASP.NET MVC4里面写如下代码: @Html.TextBoxFor(m => m.UserName, ...

随机推荐

  1. pcl计算样点法向并显示

    利用最小二乘法估计样点表面法向,并显示 #include <pcl/point_types.h> #include <pcl/io/pcd_io.h> #include < ...

  2. [LeetCode] Best Time to Buy and Sell Stock II 买股票的最佳时间之二

    Say you have an array for which the ith element is the price of a given stock on day i. Design an al ...

  3. 用vue.js学习es6(三):数组、对象和函数的解构

    一.数组的解构: 以前的方式: var arr = [1,2,3]; console.log(arr[0]); //1 console.log(arr[1]); //2 现在的方式: var [a,b ...

  4. Android Studio导入项目遇到的问题

    [ Failed to resolve: com.afollestad:material-dialogs:0.7.5.5] 解决办法: 1.打开app目录下的build.gradle文件,然后在and ...

  5. FastDFS 通过文件名获取文件信息

    /** * 获取文件信息 * * param string group_name 文件所在的组名 * param string file_id 文件id(如: M00/09/BE/rBBZolgj6O ...

  6. consolel API大全-附测试结果

    f 简介: JS中默认没有console对象, 这是某些浏览器提供的浏览器内置对象, 低版本IE就没有, 其他主流浏览器应该都有.它能看到结构话的东西,如果是alert,淡出一个对象就是[object ...

  7. C#面向对象设计模式纵横谈——3.Abstract Factory 抽象工厂(创建型模式)

    动机(Motivation) 在软件系统中经常面临着“一系列相互依赖的对象”的创建工作,同时,由于需求变化,往往存在更多系列对象的创建工作.如何应对这种变化?如何绕过常规对象的创建,提供一种“封装机制 ...

  8. bzoj4443[SCOI2015]小凸玩矩阵

    题意:一个n*m的矩阵(n<=m<=250),要求选出n个数(每行,每列最多选一个),求第k大数的最小值. 首先第k大的意思是从大到小的第k个数(我读错了,WA了一次还以为算法不对...) ...

  9. 统一的Json组件和csv下载组件

    java-web-common java-web-common Json组件 目标和用途 规范Json接口格式 Controller中一律返回Java object,组件将自动转换数据格式,满足Jso ...

  10. java 在循环中删除数组元素

    在写代码中经常会遇到需要在数组循环中删除数组元素的情况,但删除会导致数组长度变化. package com.fortunedr.thirdReport; import java.util.ArrayL ...