日期:2014-05-16  浏览次数:20277 次

字符串转换成json的三种方式(浏览器自带,不用类库)
使用Ajax的开发项目过程中,经常需要将json格式的字符串返回到前端,前端解析成js对象(json)。先组装一个json格式的字符串:
var str = '{ "key": "key" ';//str = '{ "x": "Hello, World!", "y": [1, 2, 3] }';
for(var i=0; i<10000; i++){
	str = str + ',' + '"key' + i + '" : "key' + i + '"';
}
str = str + '}';

以下是三种将字符串转化为json的方式:
1.eval方式解析
var jsonObject = eval('(' + str + ')');

记得别忘了str两旁的小括号。

2.new Function形式
var jsonObject = (new Function("return " + str))();


3.使用全局的JSON对象
var jsonObject = JSON.parse(str);

ECMA-262(E3) 中没有将JSON概念写到标准中,还好在 ECMA-262(E5)中JSON的概念被正式引入了,包括全局的JSON对象和Date的toJSON方法。
目前 IE8(S)/Firefox3.5+/Chrome4/Safari4/Opera10 已实现了该方法。
使用JSON.parse需严格遵守JSON规范,如属性都需用引号引起来,如下
var str = '{name:"jack"}';  
var obj = JSON.parse(str); // --> parse error 
name没有用引号引起来,使用JSON.parse所有浏览器中均抛异常,解析失败。而前两种方式则没问题。

总结:eval与new Function方式都不安全,其中new Function比eval高效!
     JSON方式相对上面两种方式来说,更安全,更高效!但是在一些版本低的浏览器中不兼容!

所以综合考虑,可以用下面的方法:
//jQuery源码中的parseJSON方法
 function parseJSON(data){
     if ( typeof data !== "string" || !data ) {   
         return null;   
     }
     // Make sure leading/trailing whitespace is removed (IE can't handle it)   
     // data = jQuery.trim( data );   屏蔽掉
     
     // Make sure the incoming data is actual JSON   
     // Logic borrowed from http://json.org/json2.js   
     if ( /^[\],:{}\s]*$/.test(data.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, "@")   
         .replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, "]")   
         .replace(/(?:^|:|,)(?:\s*\[)+/g, "")) ) {
         // Try to use the native JSON parser first   
         return window.JSON && window.JSON.parse ? window.JSON.parse(data) : (new Function("return " + data))();   
     }
     return null;
 }