A-A+

javascript中JSON的操作介绍

2016年02月19日 web前端设计 暂无评论 阅读 6 views 次

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式。同时,JSON是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不需要任何特殊的 API 或工具包。

JSON语法

JSON建构于两种结构:

对象——名称/值对的集合。不同的语言中,它被理解为对象,纪录,结构,字典,哈希表,有键列表(keyed list),或者关联数组。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’ 对”之间使用“,”(逗号)分隔。

数组——值的有序列表。在大部分语言中,它被理解为数组。一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间使用“,”(逗号)分隔。

JSON没有变量或其他控制结构。JSON只用于数据传输。

本文主要是对JS操作JSON的方法做下总结。

在JSON中,有两种结构:对象和数组。

1. 一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’ 对”之间使用“,”(逗号)分隔,名称用引号括起来,值如果是字符串则必须用括号,数值型则不需要。

例如如下代码:

var o={"xlid":"cxh","xldigitid":123456,"topscore":2000,"topplaytime":"2009-08-20"};

2. 数组是值(value)的有序集合。一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间使用“,”(逗号)分隔。

例如如下代码:

var jsonranklist=[{"xlid":"cxh","xldigitid":123456,"topscore":2000,"topplaytime":"2009-08-20"},{"xlid":"zd","xldigitid":123456,"topscore":1500,"topplaytime":"2009-11-20"}];

为了方便地处理JSON数据,JSON提供了json.js包,下载地址:

http://www.json.org/json.js

在数据传输过程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键。例如:

JSON字符串,代码如下:

var str1 = '{ "name": "cxh", "sex": "man" }';

JSON对象:

var str2 = { "name": "cxh", "sex": "man" };

一、JSON字符串转换为JSON对象

要使用上面的str1,必须使用下面的方法先转化为JSON对象,代码如下:

//由JSON字符串转换为JSON对象

var obj = eval('(' + str + ')');

或者:

var obj = str.parseJSON(); //由JSON字符串转换为JSON对象

或者:

var obj = JSON.parse(str); //由JSON字符串转换为JSON对象

然后,就可以这样读取,代码如下:

Alert(obj.name);

Alert(obj.sex);

特别注意:如果obj本来就是一个JSON对象,那么使用eval()函数转换后(哪怕是多次转换)还是JSON对象,但是使用parseJSON()函数处理后会有问题(抛出语法异常)。

二、可以使用toJSONString()或者全局方法JSON.stringify()将JSON对象转化为JSON字符串,代码如下:

例如:var last=obj.toJSONString(); //将JSON对象转化为JSON字符

或者

var last=JSON.stringify(obj); //将JSON对象转化为JSON字符

alert(last);

string对象转化为json对象.

  1. function stringToJson(stringValue)  
  2. {  
  3.    eval("var theJsonValue = "+stringValue);  
  4.    return theJsonValue;  
  5. }  

4:json数组转化为 String对象的方法(要掉要上面那个方法)

  1. function JsonArrayToStringCfz(jsonArray)  
  2.    var JsonArrayString = "[";  
  3.    for(var i=0;i<jsonArray.length;i++){  
  4.    JsonArrayString=JsonArrayString+JsonToStringCfz(jsonArray[i])+",";  
  5.    }  
  6.    JsonArrayString = JsonArrayString.substring(0,JsonArrayString.length-1)+"]";  
  7.    return JsonArrayString;  
  8. }  

5 利用json.js json转string

  1. <script src="json2.js"></script>  
  2. <script>  
  3. var date = {myArr : ["a" , "b" , "c" , "d"] , count : 4};  
  4. var str = JSON.stringify(date);  
  5. alert(str);  
  6. </script>  

使用XMLHttpRequest对象创建JSON数据请求

1、创建请求

如果直接请求服务器上一个JSON文件中的JSON数据,则可以利用文件名来请求JSON文件,代码如下:

respone.open(“GET”,”classes.txt”,true);

在这种情况下,classes.txt是JSON数据文件的名称,request是创建用来存放XMLHttpRequest对象的变量。

2、 解析响应

一旦接受服务器的JSON数据,就可以采用两种不同的方式解析该响应。可以使用JavaScript的内置函数eval(),或者为了进一步的安全,使用JSON解析器代替。

eval()方法可以把JavaScript字符串当作参数,还可以将该字符串转换成对象,或作为命令动作。如果使用XMLHttpRequest对象的responseText属性请求JSON数据,那么使用eval()将JSON文本字符串转换成JavaScript对象。因为JSON字符串常包包含花括号,所以用圆括号来括住JSON字符串,以表明字它是一个求值表达式,而不是一个要运行的命令,代码如下:

var jsonResp=request.responseText;

jsonResp=eval(“(”+jsonResp+”)”);

如果Web服务器既提供JSON数据也提供请求页面,则适合选用eval()方法。如果涉及安全,则适合使用JSON解析器。JSON解析器只作用于JSON文本,并且不执行其他JavaScript。在这种情况下,可以使用responseText,但要使用parseJSON()方法将JSON文本字符串转换成JavaScript对象。要访问parseJOSN函数,需要要添加引用json.js文件到页面中,代码如下:

var jsonResp=request.responseText;

jsonResp=jsonResp.parseJSON();

下面以实例来说明在JavaScript中简单使用JSON,代码如下:

  1. <script type="text/javascript">  
  2. var user =[  
  3. {  
  4.       "name":”shenmiweiyi”,  
  5.       "QQ":306451129,  
  6.       "email":”shenmiweiyi@163.com”  
  7.       "address":  
  8.       [  
  9.             {"City":"ZhengZhou","ZipCode":"450000"},  
  10.             {"City":"BeiJing","ZipCode":"100000"}  
  11.       ]  
  12. },  
  13. {  
  14.       "name":”kehao”,  
  15.       "QQ":254892313,  
  16.       "email":”kehao@163.com”  
  17.       "address":  
  18.       [  
  19.             {"City":"ShangHai","ZipCode":"200000"},  
  20.             {"City":"GuangZhou","ZipCode":"510000"}  
  21.       ]  
  22.  }  
  23. ]  
  24. alert(user[0].name+”的Email是:”user[0].email);  //outputs shenmiweiyi的Email是:shenmiweiyi@163.com  
  25.  alert(user[1].name+”住在:”user[1].address[0].city) //outputs kehao住在:ShangHai  
  26. pt>  
标签:

给我留言