在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式:

1.一种为使用eval()函数。

2. 使用Function对象来进行返回解析。

第一种解析方式:使用eval函数来解析,并且使用jQuery的each方法来遍历

用jQuery解析JSON数据的方法,作为jQuery异步请求的传输对象,jQuery请求后返回的结果是json对象,这里考虑的都是服务器返回JSON形式的字符串的形式,对于利用JSONObject等插件封装的JSON对象,与此亦是大同小异,这里不再做说明。
这里首先给出JSON字符串集,字符串集如下:

var data = " {
root:
    [
        {name: '1', value: '0'},
        {name: '6101', value: '北京市'},
        {name: '6102', value: '天津市'},
        {name: '6103', value: '上海市'},
        {name: '6104', value: '重庆市'},
        {name: '6105', value: '渭南市'},
        {name: '6106', value: '延安市'},
        {name: '6107', value: '汉中市'},
        {name: '6108', value: '榆林市'},
        {name: '6109', value: '安康市'},
        {name: '6110', value: '商洛市'}
    ]
}
";

这里以jQuery异步获取的数据类型——json对象和字符串为依据,分别介绍两种方式获取到的结果处理方式。

1、对于服务器返回的JSON字符串,如果jQuery异步请求没做类型说明,或者以字符串方式接受,那么需要做一次对象化处理,方式不是太麻烦,就是将该字符串放于eval()中执行一次。这种方式也适合以普通JavaScipt方式获取json对象,以下举例说明:

var dataObj = eval("(" + data + ")");  // 转换为json对象

为什么要 eval这里要添加  "(" + data + ")" 呢?

原因在于:eval本身的问题。 由于json是以“{}”的方式来开始以及结束的,在JS中,它会被当成一个语句块来处理,所以必须强制性的将它转换成一种表达式。

加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将括号内的表达式(expression)转化为对象,而不是作为语句(statement)来执行。举一个例子,例如对象字面量{},如若不加外层的括号,那么eval会将大括号识别为JavaScript代码块的开始和结束标记,那么{}将会被认为是执行了一句空语句。所以下面两个执行结果是不同的:

alert(eval("{}"); // return undefined
alert(eval("({})");// return object[Object]

对于这种写法,在JS中,可以到处看到。

如: (function(){})();  做闭包操作时等。

alert(dataObj.root.length);//输出root的子对象数量
$.each(dataObj.root, fucntion(idx, item) {
if (idx == 0) {
return true;
} //输出每个root子对象的名称和值
alert("name:" + item.name + ",value:" + item.value);
})

2、对于服务器返回的JSON字符串,如果jQuery异步请求将type(一般为这个配置属性)设为“json”,或者利用$.getJSON()方法获得服务器返回,那么就不需要eval()方法了,因为这时候得到的结果已经是json对象了,只需直接调用该对象即可,这里以$.getJSON方法为例说明数据处理方法:

$.getJSON("http://blog.snsgou.com/", {param: "snsgou"}, function (data) {
// 此处返回的data已经是json对象
// 以下其他操作同第一种情况
$.each(data.root, function (index, item) {
if (index == 0) {
return true; // 同countinue,返回false同break
}
alert("name:" + item.name + ",value:" + item.value);
});
});

这里特别需要注意的是方式1中的eval()方法是动态执行其中字符串(可能是js脚本)的,这样很容易会造成系统的安全问题。所以可以采用一些规避了eval()的第三方客户端脚本库,比如JSON in JavaScript就提供了一个不超过3k的脚本库。

第二种解析方式:使用Function对象来完成,它的典型应用就是在jQuery中的AJAX方法下的success等对于返回数据data的解析

var json='{"name":"CJ","age":18}';

data =(new Function("", "return " + json))();

此时的data就是一个会解析成一个 json对象了。

参考:

ECMAScript Function 对象(类)

JS接收json总结 new Function,eval,new Array

使用new Function解析JSON数据

延伸阅读:

JavaScript操作JSON的方法总结,JSON字符串转换为JSON对象

老外们也在讨论:

Evaluating JSON strings - eval() vs. new Function()

jQuery uses (new Function(“return ” + data))(); instead of eval(data); to parse JSON, why?

最后的结论是:

json字符串转json对象,使用 (new Function("return " + jsonString))(); 来代替 eval('(' + jsonString + ')');

【荐】使用eval()、new Function()将JSON字符串转换为JSON对象的更多相关文章

  1. JavaScript操作JSON的方法总结,JSON字符串转换为JSON对象

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意 ...

  2. JSON字符串转换为JSON对象

    一.JSON字符串转换为JSON对象 A:eval函数 eval函数可以直接将本质符合或者近似符合JSON格式的字符串转换为JSON对象,使用方式如: eval('(' + str + ')'); / ...

  3. js 将json字符串转换为json对象的方法解析

    推荐: var obj = eval('(' + str + ')'); var last=JSON.stringify(obj); //将JSON对象转化为string字符 例如: JSON字符串: ...

  4. javaScript 将json字符串转换为json对象的方法解析

    JSON字符串: var str1 = '{ "name": "cxh", "sex": "man" }'; JSON对 ...

  5. js 将json字符串转换为json兑现

    在数据传输过程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键.例如:JSON字符串:var str1 = '{ &quo ...

  6. js 将json字符串转换为json对象的方法解析-转

    例如: JSON字符串:var str1 = '{ "name": "cxh", "sex": "man" }'; JS ...

  7. js 将json字符串转换为json对象

    要引入:jquery-json-2.4.js 在数据传输过程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键.例如: JS ...

  8. Json字符串转换为java对象的各种实现方法【json_lib框架、Gson、org.json】

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://mengzhengbin520.blog.51cto.com/7590564/12 ...

  9. JSON 字符串转换为JavaScript 对象.JSON.parse()和JSON.stringify()

    使用 JavaScript 内置函数 JSON.parse() 将字符串转换为 JavaScript 对象: var text = '{ "sites" : [' + '{ &qu ...

随机推荐

  1. Hibernate注解配置

    在之前的第一次对框架的实际应用中,我使用的是Hibernate的xml配置方法,xml配置方法非常繁琐, 还是推荐所有使用Hibernate的人使用注解方式进行配置,在这篇文章中,我将列举出我们常用的 ...

  2. 洛谷P1108 低价购买[DP | LIS方案数]

    题目描述 “低价购买”这条建议是在奶牛股票市场取得成功的一半规则.要想被认为是伟大的投资者,你必须遵循以下的问题建议:“低价购买:再低价购买”.每次你购买一支股票,你必须用低于你上次购买它的价格购买它 ...

  3. PHP代码重用与函数编写

    代码重用与函数编写 1.使用require()和include()函数 这两个函数的作用是将一个文件爱你载入到PHP脚本中,这样就可以直接调用这个文件中的方法.require()和include()几 ...

  4. django博客功能实现——标签功能

    标签功能添加流程 0.功能概括 标签作为文章中的分类标记,会显示出该文章是关于哪一方面的文章,比如是关于python的还是关于django的. 当我们点击该标签的时候,会出现该博客中所有属于该标签的文 ...

  5. MAVEN构建Spring +Spring mvc + Mybatis 项目(Maven配置部分(workshop))

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...

  6. VPS搭建VPN、BLOG

    FQ的正确姿势,你掌握了多少?老司机带你去墙外看看,来开车了坐稳! 购买VPS主机(服务端) 推荐性价比较高的VPS 搬瓦工https://bandwagonhost.com/ 上面的链接如果你打不开 ...

  7. Python-04-基础

    一.装饰器(decorator) 装饰器本质上也是函数,目的是为其他函数添加附加功能(装饰其他函数) Python通过使用装饰器来达到代码的开放与封闭. 原则: 不能修改被装饰函数的源代码. 不能修改 ...

  8. Freemarker常用技巧

    1,截取字符串 有的时候我们在页面中不需要显示那么长的字符串,比如新闻标题,这样用下面的例子就可以自定义显示的长度 < lt. <= lte. > gt. >= gte < ...

  9. 微信小程序之生命周期(三)

    [未经作者本人同意,请勿以任何形式转载] 上一篇介绍微信小程序开发工具使用和项目目录结构. 这一章节介绍微信小程序的生命周期,什么是生命周期呢? 通俗的讲,生命周期就是指一个对象的生老病死. 从软件的 ...

  10. [CareerCup] 6.6 Toggle Lockers 切换锁的状态

    6.6 There are 100 closed lockers in a hallway. A man begins by opening all 100 lockers. Next, he clo ...