JSON字符串和对象相互转换实例分析


Posted in Javascript onJune 16, 2016

本文实例分析了JSON字符串和对象相互转换方法。分享给大家供大家参考,具体如下:

同事问了我一个问题——server端返回了一个json结构的字符串,怎么样去访问json对象里面的值?jquery有没有对返回的JSON数据进行解析?

我自己写了一个小的demo,还有从网上查了一些资料,在这里跟大家分享一下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(
  function(){
    var json = {"name":"Mike","sex":"女","age":29}; 
    alert(typeof json);
    var temp = obj2str(json);
    alert(temp);
    alert(typeof temp);
  }
);
//下面这个方法是将json对象转换为字符串
function obj2str(o){
 var r = [];
 if(typeof o =="string") return "\""+o.replace(/([\'\"\\])/g,"\\$1").replace(/(\n)/g,"\\n").replace(/(\r)/g,"\\r").replace(/(\t)/g,"\\t")+"\"";
 if(typeof o =="undefined") return "undefined";
 if(typeof o == "object"){
  if(o===null) return "null";
  else if(!o.sort){
   for(var i in o)
    r.push(i+":"+obj2str(o[i]))
   r="{"+r.join()+"}"
  }else{
   for(var i =0;i<o.length;i++)
    r.push(obj2str(o[i]))
   r="["+r.join()+"]"
  }
  return r;
 }
 return o.toString();
}
/*使用jquery插件,需要注意的是json的key-value必须都为字符串,即都需要使用双引号包起来,
不能使用单引号,如果value是数字就不需要用双引号包起来*/
function jquery_string_to_json(){
  var jsonString = '{"name":"huangbiao","sex":"boy","age":16}';
  //var jsonString = "{'name':'huangbiao','sex':'boy','age':16}";//错误的声明
  alert(typeof jsonString);
  var obj = jQuery.parseJSON(jsonString);
  alert(typeof obj);
}
/*使用eval方法对于字符串里面的key-value都必须使用双引号括起来,不能使用单引号,否则不
能够正常解析*/
function String_to_JSON(){
  var json = '{"name":"huangbiao","sex":"boy","age":16}';
  var temp = eval('('+json+')');//eval方法里面的括号是不能够少的,否则报脚本错误
  alert(typeof temp);
  alert(temp.name);
  //使用JSON对象只能在IE8以上的版本支持,因此不建议使用这种方式转换
  //var json = '{"name":"Mike","sex":"女","age":"29"}'; 
  //var temp = JSON.parse(json);
  //alert(temp.name);
}
</script>
<title>无标题文档</title>
</head>
<body>
</body>
</html>

在工作中发现server端传给前端JSON格式的字符串,使用eval("("+json+")");没有办法将得到的字符串转换为JSON对象,解决办法如下:

function obj2str(o){
 var r = [];
 if(typeof o =="string") return "\""+o.replace(/([\'\"\\])/g,"\\$1").replace(/(\n)/g,"\\n").replace(/(\r)/g,"\\r").replace(/(\t)/g,"\\t")+"\"";
 if(typeof o =="undefined") return "undefined";
 if(typeof o == "object"){
  if(o===null) return "null";
  else if(!o.sort){
   for(var i in o)
    r.push(i+":"+obj2str(o[i]))
   r="{"+r.join()+"}"
  }else{
   for(var i =0;i<o.length;i++)
    r.push(obj2str(o[i]))
   r="["+r.join()+"]"
  }
  return r;
 }
 return o.toString();
}
function json2obj(o){
  var result = obj2str(o);
  return eval("(" + result + ")");
}

调用json2obj(o)这个方法即可。

PS:这里再为大家推荐几款json在线工具,相信大家在今后的开发中可以用得到:

在线JSON代码检验、检验、美化、格式化工具:
http://tools.3water.com/code/json

JSON在线格式化工具:
http://tools.3water.com/code/jsonformat

在线XML/JSON互相转换工具:
http://tools.3water.com/code/xmljson

json代码在线格式化/美化/压缩/编辑/转换工具:
http://tools.3water.com/code/jsoncodeformat

C语言风格/HTML/CSS/json代码格式化美化工具:
http://tools.3water.com/code/ccode_html_css_json

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript iframe内的函数调用实现方法
Jul 19 Javascript
来自qq的javascript面试题
Jul 24 Javascript
js有关元素内容操作小结
Dec 20 Javascript
Jquery实现简单的动画效果代码
Mar 18 Javascript
JS实现图片预加载无需等待
Dec 21 Javascript
关于js中for in的缺陷浅析
Dec 02 Javascript
浅析tr的隐藏和显示问题
Mar 05 Javascript
js简单的点击返回顶部效果实现方法
Apr 10 Javascript
直接拿来用的页面跳转进度条JS实现
Jan 06 Javascript
react-native组件中NavigatorIOS和ListView结合使用的方法
Sep 30 Javascript
Vuex 使用 v-model 配合 state的方法
Nov 13 Javascript
小程序云开发如何实现图片上传及发表文字
May 17 Javascript
jQuery的层级查找方式分析
Jun 16 #Javascript
jQuery实现响应鼠标事件的图片透明效果【附demo源码下载】
Jun 16 #Javascript
JS中sort函数排序用法实例分析
Jun 16 #Javascript
JS原型对象的创建方法详解
Jun 16 #Javascript
JS使用单链表统计英语单词出现次数
Jun 16 #Javascript
JS实用技巧小结(屏蔽错误、div滚动条设置、背景图片位置等)
Jun 16 #Javascript
javascript的replace方法结合正则使用实例总结
Jun 16 #Javascript
You might like
php中使用exec,system等函数调用系统命令的方法(不建议使用,可导致安全问题)
2012/09/07 PHP
PHP执行shell脚本运行程序不产生core文件的方法
2016/12/28 PHP
PHP进程通信基础之信号量与共享内存通信
2017/02/19 PHP
PHP获取中国时间(上海时区时间)及美国时间的方法
2017/02/23 PHP
php读取和保存base64编码的图片内容
2017/04/22 PHP
基于PHP实现的多元线性回归模拟曲线算法
2018/01/30 PHP
javascript中的location用法简单介绍
2007/03/07 Javascript
Javascript中this的用法详解
2014/09/22 Javascript
jQuery中:text选择器用法实例
2015/01/03 Javascript
javascript中Math.random()使用详解
2015/04/15 Javascript
利用JQuery写一个简单的异步分页插件
2016/03/07 Javascript
JS代码实现百度地图 画圆 删除标注
2016/10/12 Javascript
Vue.js 递归组件实现树形菜单(实例分享)
2016/12/21 Javascript
微信小程序实现页面跳转传值的方法
2017/10/12 Javascript
Angular2仿照微信UI实现9张图片上传和预览的示例代码
2017/10/19 Javascript
JavaScript之解构赋值的理解
2019/01/30 Javascript
JavaScript实现网页动态生成表格
2020/11/25 Javascript
[01:36:19]Secret vs NB 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python中SOAP项目的介绍及其在web开发中的应用
2015/04/14 Python
使用Python脚本将文字转换为图片的实例分享
2015/08/29 Python
Python之dict(或对象)与json之间的互相转化实例
2018/06/05 Python
pandas的qcut()方法详解
2019/07/06 Python
Python企业编码生成系统总体系统设计概述
2019/07/26 Python
PYQT5开启多个线程和窗口,多线程与多窗口的交互实例
2019/12/13 Python
Windows上安装tensorflow  详细教程(图文详解)
2020/02/04 Python
PyQt5 控件字体样式等设置的实现
2020/05/13 Python
JavaScript+Canvas实现自定义画板的示例代码
2019/05/13 HTML / CSS
La Senza官网:北美顶尖性感内衣品牌
2018/08/03 全球购物
Oral-B荷兰:牙医最推荐的品牌
2020/02/25 全球购物
大学生求职简历的自我评价
2013/10/14 职场文书
建筑工程专业学生的自我评价
2013/12/25 职场文书
面试必备的求职信
2014/05/25 职场文书
新农村建设典型材料
2014/05/31 职场文书
关于读书的演讲稿1000字
2014/08/27 职场文书
六一晚会主持词开场白
2015/05/28 职场文书
用人单位的规章制度,怎样制定才是有效的?
2019/07/09 职场文书