JSON入门 & 理解

原文链接:(按顺序)

http://www.ibm.com/developerworks/cn/web/wa-lo-json/ JSON入门指南

http://www.ruanyifeng.com/blog/2009/05/data_types_and_json.html 阮一峰老师的一点理解


JSON 入门指南

JSON 即 JavaScript Object Natation,它是一种轻量级的数据交换格式,非常适合于服务器与 JavaScript 的交互。本文将快速讲解 JSON 格式,并通过代码示例演示如何分别在客户端和服务器端进行 JSON 格式数据的处理。

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

现在, JSON 为 Web 应用开发者提供了另一种数据交换格式。让我们来看看 JSON 到底是什么,同 XML 或 HTML 片段相比,JSON 提供了更好的简单性和灵活性。

Ajax 资源中心

请访问 Ajax 资源中心,这是有关 Ajax 编程模型信息的一站式中心,包括很多文档、教程、论坛、blog、wiki 和新闻。任何 Ajax 的新信息都能在这里找到。

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 的完整表示结构:

图 1. String 的完整表示结构
图 1. String 的完整表示结构

一个 Number 可以根据整型或浮点数表示如下:

图 2. Number 的表示结构
图 2. Number 的表示结构

这与绝大多数编程语言的表示方法一致,例如:

12345(整数)
 -3.9e10(浮点数)

Boolean 类型表示为 true 或 false 。此外,JavaScript 中的 null 被表示为 null,注意,truefalse 和 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 表示。

例如,一个 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}
}

JavaScript 处理 JSON 数据

上面介绍了如何用 JSON 表示数据,接下来,我们还要解决如何在服务器端生成 JSON 格式的数据以便发送到客户端,以及客户端如何使用 JavaScript 处理 JSON 格式的数据。

我们先讨论如何在 Web 页面中用 JavaScript 处理 JSON 数据。我们通过一个简单的 JavaScript 方法就能看到客户端如何将 JSON 数据表示给用户:

function handleJson() { 
  var j={"name":"Michael","address":
      {"city":"Beijing","street":" Chaoyang Road ","postcode":100025}
  }; 
  document.write(j.name); 
  document.write(j.address.city); 
 }

假定服务器返回的 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 格式的数据。以 Java 为例,我们将演示将一个 Java 对象编码为 JSON 格式的文本。

将 String 对象编码为 JSON 格式时,只需处理好特殊字符即可。另外,必须用 (") 而非 (') 表示字符串:

 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(); 
 }

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

 public static String toJson(Object o) { 
    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()); 
 }

我们并未对 Java 对象作严格的检查。不被支持的对象(例如 List)将直接抛出 RuntimeException 。此外,为了保证输出的 JSON 是有效的,Map<String, Object> 对象的 Key 也不能包含特殊字符。细心的读者可能还会发现循环引用的对象会引发无限递归,例如,精心构造一个循环引用的 Map,就可以检测到 StackOverflowException

 @Test(expected=StackOverflowError.class) 
 public void testRecurrsiveMap2Json() { 
    Map<String, Object> map = new HashMap<String, Object>(); 
    map.put("key", map); 
    JsonUtil.map2Json(map); 
 }

好在服务器处理的 JSON 数据最终都应该转化为简单的 JavaScript 对象,因此,递归引用的可能性很小。

最后,通过 Servlet 或 MVC 框架输出 JSON 时,需要设置正确的 MIME 类型(application/json)和字符编码。假定服务器使用 UTF-8 编码,则可以使用以下代码输出编码后的 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格式

作者: 阮一峰

前几天,我才知道有一种简化的数据交换格式,叫做yaml

我翻了一遍它的文档,看懂的地方不多,但是有一句话令我茅塞顿开。

它说,从结构上看,所有的数据(data)最终都可以分解成三种类型

第一种类型是标量(scalar),也就是一个单独的字符串(string)或数字(numbers),比如"北京"这个单独的词。

第二种类型是序列(sequence),也就是若干个相关的数据按照一定顺序并列在一起,又叫做数组(array)或列表(List),比如"北京,上海"。

第三种类型是映射(mapping),也就是一个名/值对(Name/value),即数据有一个名称,还有一个与之相对应的值,这又称作散列(hash)或字典(dictionary),比如"首都:北京"。

我恍然大悟,数据构成的最小单位原来如此简单!难怪在编程语言中,只要有了数组(array)和对象(object)就能够储存一切数据了。

我马上想到了json

21世纪初,Douglas Crockford寻找一种简便的数据交换格式,能够在服务器之间交换数据。当时通用的数据交换语言是XML,但是Douglas Crockford觉得XML的生成和解析都太麻烦,所以他提出了一种简化格式,也就是Json。

Json的规格非常简单,只用一个页面几百个字就能说清楚,而且Douglas Crockford声称这个规格永远不必升级,因为该规定的都规定了。

1) 并列的数据之间用逗号(", ")分隔。

2) 映射用冒号(": ")表示。

3) 并列数据的集合(数组)用方括号("[]")表示。

4) 映射的集合(对象)用大括号("{}")表示。

上面四条规则,就是Json格式的所有内容。

比如,下面这句话:

"北京市的面积为16800平方公里,常住人口1600万人。上海市的面积为6400平方公里,常住人口1800万。"

写成json格式就是这样:

[
  {"城市":"北京","面积":16800,"人口":1600},
  {"城市":"上海","面积":6400,"人口":1800}
]

如果事先知道数据的结构,上面的写法还可以进一步简化:

[
  ["北京",16800,1600],
  ["上海",6400,1800]
]

由此可以看到,json非常易学易用。所以,在短短几年中,它就取代xml,成为了互联网上最受欢迎的数据交换格式。

我猜想,Douglas Crockford一定事先就知道,数据结构可以简化成三种形式,否则怎么可能将json定义得如此精炼呢!

学习javascript的时候,我曾经一度搞不清楚"数组"(array)和"对象"(object)的根本区别在哪里,两者都可以用来表示数据的集合。

比如有一个数组a=[1,2,3,4],还有一个对象a={0:1,1:2,2:3,3:4},然后你运行alert(a[1]),两种情况下的运行结果是相同的!这就是说,数据集合既可以用数组表示,也可以用对象表示,那么我到底该用哪一种呢?

我后来才知道,数组表示有序数据的集合,而对象表示无序数据的集合。如果数据的顺序很重要,就用数组,否则就用对象。

当然,数组和对象的另一个区别是,数组的数据没有"名称"(name),对象的数据有"名称"(name)。

但是问题是,很多编程语言中,都有一种叫做"关联数组"(associative array)的东西。这种数组中的数据是有名称的。

比如在javascript中,可以这样定义一个对象:

var a={"城市":"北京","面积":16800,"人口":1600};

但是,也可以定义成一个关联数组:

a["城市"]="北京";
a["面积"]=16800;
a["人口"]=1600;

这起初也加剧了我对数组和对象的混淆,后来才明白,在Javascript语言中,关联数组就是对象,对象就是关联数组。这一点与php语言完全不同,在php中,关联数组也是数组。

比如运行下面这段javascript:

var a=[1,2,3,4];

a['foo']='Hello World';

alert(a.length);

最后的结果是4,也就是说,数组a的元素个数是4个。

但是,运行同样内容的php代码就不一样了:

<?php

$a=array(1,2,3,4);

$a["foo"]="Hello world";

echo count($a);

?>

最后的结果是5,也就是说,数组a的元素个数是5个。

===================================================================================================================

推荐几个JSON的格式化网站:

http://abv.cn/json/

http://www.sojson.com/

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值