What is JSON：初识JSON

本篇介绍JSON的基础知识。在没有接触AJAX之前我还不知道什么是JSON，在读Jeffrey Zhao的《深入Atlas系列》时才看到这个词，所以有必要了解一下JSON。这里我结合今天初浅的认识及一个小练习记录我的学习。

JSON是什么？

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于JavaScript（Standard ECMA-262 3rd Edition - December 1999）的一个子集。 JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C, C++, C#, Java, JavaScript, Perl, Python等）。这些特性使JSON成为理想的数据交换语言。

JSON建构于两种结构：

  1. “名称/值”对的集合（A collection of name/value pairs）。不同的语言中，它被理解为对象（object），纪录（record），结构（struct），字典（dictionary），哈希表（hash table），有键列表（keyed list），或者关联数组 （associative array）。
  2. 值的有序列表（An ordered list of values）。在大部分语言中，它被理解为数组（array）。

这些都是常见的数据结构。事实上大部分现代计算机语言都以某种形式支持它们。这使得一种数据格式在同样基于这些结构的编程语言之间交换成为可能。

有关JSON的更多介绍，访问它的官方网站：http://www.json.org

在JavaScript中使用JSON

JSON是JavaScript对象描述符号（object literal notation）的一个子集。正因为JSON是JavaScript的子集，所以在JavaScript中我们可以很容易的使用它。 

var myJSONObject = {"bindings": [
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"},
{"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"},
{"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"}
]
};

这个例子中，创建了一个对象，它只包含一个成员“bindings”。“bindings”是一个包含了3个对象的数组，而这每个对象都有"ircEvent"、"method"和"regex"3个成员。

这些成员可以用“.”或subscript 操作得到。 

myJSONObject.bindings[0].method    // "newURI"

我们可以使用eval()函数的eval()方法调用JavaScript的编译器把JSON文本转变成对象。因为JSON是JavaScript的一个确切的子集，编译器可以正确地解析JSON文本，然后生成一个对象结构。 

var myObject = eval('(' + myJSONtext + ')');

eval函数的执行效率很高。然而，它能够编译、执行任何的JS程序，所以这样会有安全问题。在来源可信的时候才需要使用eval，这通常是服务器提供基础页面和JSON数据的web应用程序中的情形。而很多情况中，来源是不可信的。特别是永远都不要信任客户端。

如果关心安全的话，那最好是使用JSON解析器了（js脚本中有解析功能的函数）。JSON解析器只认可JSON文本，因此它比较安全： 

var myObject = myJSONtext.parseJSON();

而JSON的字符串转换器（stringifier）则作相反的工作，它将JavaScript数据结构转换为JSON文本。JSON是不支持循环数据结构的，所以注意不能把循环的结构交给字符串转换器。 

var myJSONText = myObject.toJSONString();

这里是JSON官方网站提供的一个开源的JSON解析器和字符串转换器：json.js

 一个使用json.js的简单例子

  1. 在VS中新建一个空网站。
  2. 引入json.js文件。
    • <script type="text/javascript" src="json.js"></script>
  3. 然后添加一个HTML页面，在页面上拖放两个Textarea和三个Button；Button的ID分别为btnParser、btnEval和btnStringifier；Textarea的ID分别为txtJSON和txtJS，cols设为50，rows设为10；
  4. 编写三个Button的事件代码。
    •     <script type="text/javascript">
                //<![CDATA[
          
                    function btnStringifier_Click() {
                        var oTxtJSON = document.getElementById("txtJSON");           
                        var myObject = new Object(); //创建对象
                  var obindings = new Array();
                        var oFirst = new Object();
                        var oSecond = new Object();
                        var oThird = new Object();
                  
                  oFirst.ircEvent       = "PRIVMSG";
                  oFirst.method       = "newURI";
                  oFirst.regex       = "^http://.*";   
                        //
                  
                  obindings[      0] = oFirst;
                  obindings[      1] = oSecond;
                  obindings[      2] = oThird;
                  
                        //将obindings数组设置为myObject的bindings成员
                  myObject.bindings = obindings;
                  
                        //将对象转化成JSON文本，并把文本写入Textarea中
                  oTxtJSON.value = myObject.toJSONString(); 
              }       
          
                    function btnParser_Click() {
                        var oTxtJSON = document.getElementById("txtJSON");
                        var oTxtJS = document.getElementById("txtJS");
                        //把JSON文本转变成对象 
                  var myObject = oTxtJSON.value.parseJSON();
                  
                        //获取myObject对象的第一个bindings成员得ircEvent成员(属性值)
                  oTxtJS.value += myObject.bindings[0].ircEvent + "/";
              }       

                    function btnEval_Click() { 
                        var oTxtJSON = document.getElementById("txtJSON");
                        var oTxtJS = document.getElementById("txtJS");
                        //把JSON文本转变成对象 
                  var myObject = eval('(' + oTxtJSON.value + ')');
                  
                        //获取myObject对象的第一个bindings成员得ircEvent成员(属性值)
                  oTxtJS.value += myObject.bindings[0].method + "/";
              }

                //]]> 
          </script>
  5. 运行HTML页面，先点Stringifier，得到对象的JSON文本；然后点Parser，将JSON文本转化成对象，然后获取ircEvent成员的值；最后点Eval，它也将JSON文本转化成对象，然后获取method成员的值；看看效果：