JS对象和JSON字符串相互转化总结

在web开发中,一般情况下需要前端和服务器的交换数据,我们一般使用JSON来完成数据的传输,JavaScript操作的对象是一般是变量;因此我们需要将JSON字符串转换为JS变量,下面总结JS对象和JSON字符串相互转换的方法总结;

变量区分

//Json字符串
var json_str = '{"name":"xiao","age":12}';
//JS对象(字符串常量法):
var js_obj = {name: "xiao", age: 12};

//Josn对象:
var json_obj = {"name":"xiao","age":12};
//json数组:
var objArray = [{"name":"xiao","age":12}, {"name":"xiao","age":12}];

JSON对象和JS对象本质是一致的,至少内在表现形式是一样的,如下图所示:

这里写图片描述

JSON字符串->JS对象

JSON字符串转换为JS对象大致有三种,分别是eval()原生函数,JSON提供的Parse方法,以及new Function方法,下面一一测试。

  • eaval()函数
//需要增加一对括号,避免语法错误,该方法存在性能和安全方面的问题,不建议使用。
//方法一:
var json_obj_case1 = eval('(' + json_str+')');

加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将括号内的表达式(expression)转化为对象,而不是作为语句(statement)来执行,这是eval本身的问题。

  • Parse方法
//方法二:
var json_obj_case2 = json_str.parseJSON();
var json_obj_case3 = JSON.parse(json_str);
  • new Function()方法
//方法三:
var json_obj_case4 = (new Function("return " + json_str))();

以下是goole浏览器中转换的测试结果:

这里写图片描述

JS对象->JSON字符串

相反的,我们也会遇到需要将JS对象转换为字符串,传递给服务器,下面就是将JS对象转换为JSON字符串,有两种方法:

  • stringify函数
//方法一
var json_str_case1 = JSON.stringify(js_obj);
  • toJSONString函数
//方法二
var json_str_case2 = js_obj.toJSONString();

以下是JSON对象,JS对象转换为JSON字符串的测试结果:

这里写图片描述

posted @ 2017-05-13 11:43  小怪兽&奥特曼  阅读(171)  评论(0编辑  收藏  举报