JS前端取得并解析后台服务器返回的JSON数据的方法
摘要:主要介绍:使用eval函数解析JSON数据;$.getJSON()方法获得服务器返回的JSON数据
JavaScript eval() 函数
eval(string) 函数可计算某个字符串,并执行其中的的 JavaScript 代码。
参数string:要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句。
该方法只接受原始字符串作为参数,如果 string 参数不是原始字符串,那么该方法将不作任何改变地返回。因此请不要为 eval() 函数传递 String 对象来作为参数。
使用eval函数解析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字符串放于eval()中执行一次
- 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(){
- })(jQuery); //做闭包操作
闭包就是将函数内部和函数外部连接起来的一座桥梁!
利用$.getJSON()方法
提示:虽然 eval() 的功能非常强大,但在实际使用中用到它的情况并不多。
对于服务器返回的JSON字符串,如果jquery异步请求将type设为“json”,或者利用$.getJSON()方法获得服务器返回,那么就不需要eval()方法了,因为这时候得到的结果已经是json对象了,只需直接调用该对象即可,这里以$.getJSON方法为例说明json数据的处理方法:
- $.getJSON("http://www.exp99.com/",{param:"USER_GUID"},function(data){
- //此处返回的data已经是json对象
- $.each(data.root,function(idx,item){
- if(idx==0){
- return true;//同continue,返回false同break
- }
- console.log("name:"+item.name+",value:"+item.value);
- });
- });
JS前端取得并解析后台服务器返回的JSON数据的方法的更多相关文章
- javascript解析从服务器返回的json格式数据
在javascript中我们可以将服务器返回的json格式数据转换成json格式进行使用,如下: 1.服务器返回的json格式数据: 通过response.responseText获得: " ...
- 如何解析DELPHI XE5服务器返回的JSON数据(翻译)及中文乱码
<span style="font-size:14px;">一直想找如何解析JSON数据的说,今天终于找到有人发帖子了.之前有人说用superobject,Tlkjso ...
- android菜鸟学习笔记25----与服务器端交互(二)解析服务端返回的json数据及使用一个开源组件请求服务端数据
补充:关于PHP服务端可能出现的问题: 如果你刚好也像我一样,用php实现的服务端程序,采用的是apache服务器,那么虚拟主机的配置可能会影响到android应用的调试!! 在android应用中访 ...
- ajaxFileUpload上传文件成功后却无法解析服务器返回的json数据
可能是应该返回内容带了标签,过滤下 var index=data.indexOf("<"); if (index!=-1){ data=data.substring(0,in ...
- 服务器返回的json数据中含有null的处理方法
个人博客:http://guohuaden.com/2017/03/06/json-dataNull/因为有遇到过类似情况,所以就想到了一些解决方法,并且实践了一下,这里简单的做个记录. 注:有看到不 ...
- js如何解析后台传过来的json字符串
1.js如何解析后台传过来的json字符串? 注意:js是无法直接接收和使用json或者Php的数据,用的话会出现undefined,所以要转换一下. 方式一: var str = '{"r ...
- .net mvc前台如何接收和解析后台的字典类型的数据 二分搜索算法 window.onunload中使用HTTP请求 网页关闭 OpenCvSharp尝试 简单爬虫
.net mvc前台如何接收和解析后台的字典类型的数据 很久没有写博客了,最近做了一个公司门户网站的小项目,其中接触到了一些我不会的知识点,今日事情少,便记录一下,当时想在网上搜索相关的内容,但是 ...
- 【转】Jquery ajax方法解析返回的json数据
转自http://blog.csdn.net/haiqiao_2010/article/details/12653555 最近在用jQuery的ajax方法传递接收json数据时发现一个问题,那就是返 ...
- struts2:JSON在struts中的应用(JSP页面中将对象转换为JSON字符串提交、JSP页面中获取后台Response返回的JSON对象)
JSON主要创建如下两种数据对象: 由JSON格式字符串创建,转换成JavaScript的Object对象: 由JSON格式字符串创建,转换成JavaScript的List或数组链表对象. 更多关于J ...
随机推荐
- HttpServletRequest对象,自己学习的心得。
1. HttpServletRequest介绍 HttpServletRequest对象代表客户端的请求,当客户端通过Http超文本传输协议访问服务器时,Http请求头中的所有信息都封装在这个对象中, ...
- 支付宝-API接口解析-转账到银行
支付宝-API接口解析-转账到银行 扫码转账 测试地址 解析内容: alipays://platformapi/startapp?appId=09999988&actionType=toCar ...
- 【转】Nicescroll滚动条插件的用法
原网址:http://blog.csdn.net/mss359681091/article/details/52838179 Nicescroll滚动条插件是一个非常强大的基于JQUERY的滚动条插件 ...
- Java集合框架源码(三)——arrayList
1. ArrayList概述: ArrayList是List接口的可变数组的实现.实现了所有可选列表操作,并允许包括 null 在内的所有元素.除了实现 List 接口外,此类还提供一些方法来操作内部 ...
- Scala基础篇-函数式编程的重要特性
1.纯函数 表示函数无副作用(状态变化). 2.引用透明性 表示对相同输入,总是得到相同输出. 3.函数是一等公民 函数与变量.对象.类是同一等级.表示可以把函数当做参数传入另一个函数,或者作为函数的 ...
- vue2.0 自定义指令详解
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- PostgreSQL学习手册(五) 函数和操作符
PostgreSQL学习手册(五) 函数和操作符 一.逻辑操作符: 常用的逻辑操作符有:AND.OR和NOT.其语义与其它编程语言中的逻辑操作符完全相同. 二.比较操作符: 下面是Post ...
- laravel学习:php写一个简单的ioc服务管理容器
php写一个简单的ioc服务管理容器 原创: 陈晨 CoderStory 2018-01-14 最近学习laravel框架,了解到laravel核心是一个大容器,这个容器负责几乎所有服务组件的实例化以 ...
- CAD参数绘制样条线(com接口)
在CAD设计时,需要绘制样条线,用户可以设置样条线线重及颜色等属性. 主要用到函数说明: _DMxDrawX::PathLineTo 把路径下一个点移到指定位置.详细说明如下: 参数 说明 DOUBL ...
- ipv6工具类
package mapreduce.nat; import java.math.BigDecimal; import java.math.BigInteger; import java.net.Ine ...