热门:网页模板.net视频教程JQueryMVCjsonExtJs源码示例三级联动JQuery菜单
您现在的位置:.Net中文社区>> AJAX编程>>正文内容

一些JSON相关的函数

发布时间:2010年02月06日点击数: 司徒正美

JSON作为一种轻量的数据传输格式,越来越受到人们的青睐。下面是我仿照Prototype的一些实现。

  1. JSONFilter:/^\/\*-secure-([\s\S]*)\*\/\s*$/,   
  2. unfilterJSON:function(json,filter) {   
  3. return json.replace((filter || dom.JSONFilter), function(a,b){   
  4. return b || ""  
  5. });   
  6. }, 

JSONFilter完全抄自Prototype,因为后台基本上只会传输两种格式的东西给我们——文本(xmlhttp.responseText)与XML(xmlhttp.responseXML)。如果要json,我们可以eval一下,或者使用现代浏览器提供的JSON.parse方法。但问题就出在eval中,很容易出现XSS攻击。如果文本是注释就可以避免这问题,在Prototype中还检察一下请求的来源。对于自家的网站的请求,我们完全可以在请求前处理一下,让它变成如下格式:

  1. var text = '/*-secure-\n{"name": "Violet", "occupation": "character", "age": 25}\n*/'  
  2. dom.unfilterJSON(text)   
  3. // -> '{"name": "Violet", "occupation": "character", "age": 25}' 

到时我们用unfilterJSON函数提取合法的字段来eval就没问题了。

第二个函数,判断字符串是否符合JSON的格式。JSON是有固定的格式,要求键必须被双引号括起来。下面的函数提取自json2:

  1. isJSONText:function(json){//   
  2. return /^[\],:{}\s]*$/.test(json.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, "@")   
  3. .replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, "]")   
  4. .replace(/(?:^|:|,)(?:\s*\[)+/g, ""));   
  5. }, 

第三个函数,将符合JSON的格式的文本变成JSON对象。第二参数用于指明此文本是否安全(如,是否同源请求)。如果能用原生对象的parse方法就用原生的,否则动态解析它。之所以不用eval,是因为ecma那帮人头脑发热,想禁掉它。

  1. evalJSON: function( json ,sanitize) {     
  2. if ( !is(json,"String") || !json )   
  3. return null;   
  4. json = dom.unfilterJSON(json);   
  5. //判定是否符合JSON的格式 from http://json.org/json2.js   
  6. if ( !sanitize || dom.isJSONText(json) ) {   
  7. return window.JSON && window.JSON.parse ?   
  8. window.JSON.parse( json ) : (new Function("return " + json))();   
  9. else {   
  10. throw  "Invalid JSON: " + json;   
  11. }   
  12. }   
  13. //is函数见:http://www.cnblogs.com/rubylouvre/archive/2010/01/20/1652646.html   
  14. var data =dom.evalJSON( '{ "name": "Violet", "occupation": "character" }');   
  15. data.name;   
  16. //-> "Violet" 

第四函数,将JSON对象变成文本。

  1. toJSON : function(obj) {   
  2. if(is(window.JSON,"JSON")){   
  3. return JSON.stringify(obj)   
  4. }   
  5. function f(n) {   
  6. return n < 10 ? '0' + n : n;   
  7. }   
  8. var escapable = /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g;   
  9. var meta = {   
  10. '\b''\\b',   
  11. '\t''\\t',   
  12. '\n''\\n',   
  13. '\f''\\f',   
  14. '\r''\\r',   
  15. '"' : '\\"',   
  16. '\\': '\\\\'   
  17. };   
  18. function _char(c) {   
  19. return meta[c] ? meta[c] :'\\u'+('0000'+(+(c.charCodeAt(0))).toString(16)).slice(-4);   
  20. }   
  21. function _string(s) {   
  22. return '"' + s.replace(escapable, _char) + '"';   
  23. }   
  24. if(is(obj,"Date")){   
  25. return  '"' + obj.getUTCFullYear() + '-' +   
  26. f(obj.getUTCMonth() + 1) + '-' +   
  27. f(obj.getUTCDate())      + 'T' +   
  28. f(obj.getUTCHours())     + ':' +   
  29. f(obj.getUTCMinutes())   + ':' +   
  30. f(obj.getUTCSeconds())   + 'Z"' ;   
  31. }else if(is(obj,"Number")){   
  32. return isFinite(obj) ? obj+'' : 'null';   
  33. }else if(is(obj,"Boolean")){   
  34. return  obj+''  
  35. }else if(is(obj,"String")){   
  36. return _string(obj)   
  37. }else if(obj === null){   
  38. return "null"  
  39. }else if(is(obj,"Array")){   
  40. return '[' + (dom.filter(obj,function(value){   
  41. return dom.toJSON(value) !== undefined;   
  42. })).join(', ') + ']';   
  43. }else if(is(obj,"Object")){   
  44. var results = [];   
  45. dom.each(obj,function(value,key){   
  46. value = dom.toJSON(value)   
  47. if (!value)   
  48. results.push(dom.toJSON(key) + ': ' + value);   
  49. });   
  50. return '{' + results.join(', ') + '}';   
  51. }else {   
  52. return undefined;   
  53. }   
  54. }, 

当然你完全也可以用json2,那个绝对权威。但如果你自行实现一下,感受是完全不一样的。

更多模板/案例展示

亚太盛典国际婚纱摄影 本案例由亚太盛典国际婚纱公司所部署,精美的界面,合理的布局是网站的一大特色!
亚太盛典国际婚纱摄影 本案例由亚太盛典国际婚纱公司所部署,精美的界面,合理的布局是网站的一大特色!
关于我们 | 联系我们 | 团队日志 | 网站地图 | 网站合作