JavaScript 订阅所有【JavaScript】的日志

记录json点滴（四）

作者:rainweb 日期:2011-11-16

字体大小: 小 中 大

将后台程序(如php)发送过来的json数据转化为javascript的数组或者对象的方法十分简单，代码如下：

JavaScript代码
  1. // 假设后台发送的json数据为 '{a:2,b:1}' 存储于str中  
  2. var data = eval( '(' + str + ')' );  

然而想将一个javascript对象转化为json格式的字符串却并不那么简单，特别是对象的属性值递归包含一个对象时(如 var obj={a:[2,3],b:{m:[3,4],n:2} } ),那么有没有什么方法将obj转化为json格式的字符串呢？

当然你可以自己写一个函数，递归遍历一个对象并将其转化为json格式的字符串，对于大部分人来说这有些困难并容易出错。幸好已经有人做好了这件事情，你只用包含一段javascript代码即可。

json2.js

使用方法：

XML/HTML代码
  1. <!doctype html>  
  2. <html>  
  3. <body>  
  4. <script src="json2.js"></script>  
  5. <script>  
  6. var obj={a:[2,3],b:{m:[3,4],n:2} };  
  7. var jsonStr = JSON.stringify( obj );  
  8. alert(jsonStr);  
  9. //将显示 {"a":[2,3],"b":{"m":[3,4],"n":2}}  
  10. </script>  
  11. </body>  
  12. </html>  

假如有两个变量，我要将a转换成字符串，将b转换成JSON对象：

JavaScript代码
  1. var a={"name":"tom","sex":"男","age":"24"};  
  2. var b='{"name":"Mike","sex":"女","age":"29"}';  

在Firefox，chrome，opera，safari，ie9，ie8等高级浏览器直接可以用JSON对象的stringify()和 parse()方法。JSON.stringify(obj)将JSON转为字符串。JSON.parse(string)将字符串转为JSON格式；

上面的转换可以这么写：

JavaScript代码
  1. var a={"name":"tom","sex":"男","age":"24"};  
  2. var b='{"name":"Mike","sex":"女","age":"29"}';  
  3. var aToStr=JSON.stringify(a);  
  4. var bToObj=JSON.parse(b);  
  5. alert(typeof(aToStr));  //string  
  6. alert(typeof(bToObj));  //object  

JSON.stringify()

ie8(兼容模式),ie7和ie6没有JSON对象，不过http://www.json.org/提供了一个json.js,这样ie8(兼 容模式),ie7和ie6就可以支持JSON对象以及其stringify()和parse()方法；你可以在https://github.com /douglascrockford/JSON-js上获取到这个js，一般现在用json2.js。ie8(兼容模式),ie7和ie6可以使用 eval()将字符串转为JSON对象：

JavaScript代码
  1. var c='{"name":"Mike","sex":"女","age":"29"}';  
  2. var cToObj=eval("("+c+")");  
  3. alert(typeof(cToObj));  

jQuery中也有将字符串转为JSON格式的方法jQuery.parseJSON( json )，接受一个标准格式的 JSON 字符串，并返回解析后的 JavaScript （JSON）对象。当然如果有兴趣可以自己封装一个jQuery扩展，jQuery.stringifyJSON(obj)将JSON转为字符串。

JSON.stringify(jsonobj)，本来是最简便的方法，可是存在浏览器兼容问题（仅适用于IE8+，Chrome 1+，FF 3+）。下面再介绍一个方法：

JavaScript代码
  1. var O2String = function (O) {  
  2.        //return JSON.stringify(jsonobj);  
  3.   
  4.        var S = [];  
  5.        var J = "";  
  6.        if (Object.prototype.toString.apply(O) === '[object Array]') {  
  7.            for (var i = 0; i < O.length; i++)  
  8.                S.push(O2String(O[i]));  
  9.            J = '[' + S.join(',') + ']';  
  10.        }  
  11.        else if (Object.prototype.toString.apply(O) === '[object Date]') {  
  12.            J = "new Date(" + O.getTime() + ")";  
  13.        }  
  14.        else if (Object.prototype.toString.apply(O) === '[object RegExp]' || Object.prototype.toString.apply(O) === '[object Function]') {  
  15.            J = O.toString();  
  16.        }  
  17.        else if (Object.prototype.toString.apply(O) === '[object Object]') {  
  18.            for (var i in O) {  
  19.                O[i] = typeof (O[i]) == 'string' ? '"' + O[i] + '"' : (typeof (O[i]) === 'object' ? O2String(O[i]) : O[i]);  
  20.                S.push(i + ':' + O[i]);  
  21.            }  
  22.            J = '{' + S.join(',') + '}';  
  23.        }  
  24.   
  25.        return J;  
  26. };  

使用方法也很简单：

JavaScript代码
  1. var jsonStr = O2String(  
  2.              [  
  3.                  {  
  4.                      "Page": "plan",  
  5.                      "Custom":  
  6.                      [  
  7.                          {  
  8.                              "ItemName": "CustomLabel1",  
  9.                              "ItemContent": 1,   
  10.                              "IsItem": true,  
  11.                              "ItemDate": new Date(1320774905467),  
  12.                              "ItemReg": /[\w]*?/gi,  
  13.                              "ItemFunc": function () { alert("ItemFunc"); }  
  14.                          },  
  15.                          {  
  16.                              "ItemName": "CustomLabel1",  
  17.                              "ItemContent": 1,  
  18.                              "IsItem": true,  
  19.                              "ItemDate": new Date(1320774905467),  
  20.                              "ItemReg": /[\w]*?/gi,  
  21.                              "ItemFunc": function () { alert("ItemFunc"); }  
  22.                          }  
  23.                      ]  
  24.                  },  
  25.                  {  
  26.                      "Page": "project",  
  27.                      "Custom":  
  28.                      [  
  29.                          {  
  30.                              "ItemName": "CustomLabel2",  
  31.                              "ItemContent": 2,  
  32.                              "IsItem": false,  
  33.                              "ItemDate": new Date(1320774905467),  
  34.                              "ItemReg": /[\w]*?/gi,  
  35.                              "ItemFunc": function () { alert("ItemFunc"); }  
  36.                          },  
  37.                          {  
  38.                              "ItemName": "CustomLabel2",  
  39.                              "ItemContent": 2,  
  40.                              "IsItem": false,  
  41.                              "ItemDate": new Date(1320774905467),  
  42.                              "ItemReg": /[\w]*?/gi,  
  43.                              "ItemFunc": function () { alert("ItemFunc"); }  
  44.                          }  
  45.                      ]  
  46.                  }  
  47.              ]  
  48.          );  
  49.          alert(jsonStr);  
  50.          var jsonObj = eval("(" + jsonStr + ")");  
  51. alert(jsonObj.length);  

 




文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
相关日志:
评论: 0 | 引用: 0 | 查看次数: -
发表评论
昵　称:
密　码: 游客发言不需要密码.
内　容:
验证码: 验证码
选　项:
虽然发表评论不用注册，但是为了保护您的发言权，建议您注册帐号.