字符串转换成json的三种形式(浏览器自带,不用类库)
字符串转换成json的三种方式(浏览器自带,不用类库)
使用Ajax的开发项目过程中,经常需要将json格式的字符串返回到前端,前端解析成js对象(json)。先组装一个json格式的字符串:
以下是三种将字符串转化为json的方式:
1.eval方式解析
记得别忘了str两旁的小括号。
2.new Function形式
3.使用全局的JSON对象
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所有浏览器中均抛异常,解析失败。而前两种方式则没问题。
所以综合考虑,可以用下面的方法:
使用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; }