第168天:json对象和字符串的相互转换

json对象和字符串的相互转换

1、json对象和字符串的转换

在Firefox,chrome,opera,safari,ie9,ie8等高级浏览器直接可以用JSON对象的stringify()parse()方法。 JSON.stringify(obj)       将JSON对象转为字符串。 JSON.parse(string)       将字符串转为JSON对象格式。

 1 //使用json中的parser方法转换;
 2 
 3 var str='{"name":"fendouer", "age":23}';      //这是一个json字符串''
 4 var ob=JSON.parse(str) ;  //返回一个新对象
 5 console.log(ob.name)
 6 
 7 
 8 //把json中的stringify对象转换成字符串 
 9 
10 var obj={"student":[{"name":"cyl","age":"21"},{"name":"hyj","age":"23"}]};      //这是一个json对象
11 var str=obj.student[0].name;
12 var newstr=JSON.stringify(str); //返回一个新字符串
13 console.log(newstr);

简单例子:

1 var a={"name":"tom","sex":"男","age":"24"}; 
2 var b='{"name":"Mike","sex":"女","age":"29"}'; 
3 var aToStr=JSON.stringify(a);             //对象转换成字符串
4 var bToObj=JSON.parse(b);                //字符串转换成对象
5 alert(typeof(aToStr));                           //string 
6 alert(typeof(bToObj));                          //object 
7 JSON.stringify();

扩展:

jquery中也有将字符串转为JSON格式的方法jquery.parseJSON( json ),接受一个标准格式的 JSON 字符串,并返回解析后的 JavaScript (JSON)对象。 这只是一种方法,还有几种方法,大家可以看一下:

1) jquery插件支持的转换方式:

$.parseJSON( jsonstr );

//jquery.parseJSON(jsonstr), 可以将json字符串转换成json对象。

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>json字符串转为json对象-jQuery.parseJSON()</title>
 6         <style type="text/css">
 7             p{
 8                 white-space: pre-line;
 9                 font-size: 20px;
10             }
11         </style>
12     </head>
13     <body>
14         <p><a href="http://www.css88.com/jqapi-1.9/jQuery.parseJSON/">资源链接:http://www.css88.com/jqapi-1.9/jQuery.parseJSON/</a></p>
15         <p>jQuery中也有将字符串转为JSON格式的方法jQuery.parseJSON( json ),接受一个标准格式的 JSON 字符串,并返回解析后的 JavaScript (JSON)对象。</p>
16         <p>
17             描述: 接受一个标准格式的 JSON 字符串,并返回解析后的 JavaScript 值。
18             
19             从jQuery 3.0开始,不推荐使用$.parseJSON。 要解析JSON字符串,请改用原生的 JSON.parse 方法。
20             
21             传入格式有误的 JSON 字符串可能导致抛出异常。例如,下面这些无效的 JSON 字符串:
22             ---------------------------------------------------
23             {test: 1} (test 没有使用双引号包裹).
24             {'test': 1} ('test' 用了单引号而不是双引号包裹).
25             "{test: 1}" (test 没有使用双引号包裹).
26             "{'test': 1}" ('test' 用了单引号而不是双引号包裹).
27             "'test'" ('test' 用单引号代替双引号).
28             ".1" (number 必须以数字开头; "0.1" 将是有效的).
29             "undefined" (undefined 不能表示一个 JSON 字符串; 然而null,可以).
30             "NaN" (NaN 不能表示一个 JSON 字符串; 用Infinity直接表示无限也是不允许的).
31             ---------------------------------------------------
32             
33             JSON标准不允许“控制字符”如制表符或换行符。
34             比如$.parseJSON('{"testing":"1\t2\n3"}'),大多数实现中将抛出一个错误,因为JavaScript分析器直接转换字符串的制表符和换行符为文本的制表符和换行符; 
35             产生双反斜杠,例如"1\\t2\\n3"是预期的结果。
36             这个问题往往在服务器端语言,如PHP,JSON注入到一个JavaScript文件时发生。
37             
38             如果浏览器实现了原生的 JSON.parse, jQuery 则会使用它来解析字符串。
39             
40             在jQuery 1.9之前,如果传递给$.parseJSON一个空字符串,null, 或者 undefined,,将返回null,而不是抛出一个错误,即使这些都不是有效的JSON。
41             
42             jQuery 3.0开始,$.parseJSON已经过时(不建议使用)。要将字符串解析成JSON对象,请使用原生的JSON.parse方法来代替。
43             
44         </p>
45         <script src="js/jquery-2.1.0.js"></script>
46         <script type="text/javascript">
47             //解析一个 JSON 字符串。
48             var d = '{"name":"郑秀晶","sex":"女","age":"23","height":"165","weight":"95g"}';
49             console.log(d)      //
50             console.log(typeof(d))         //string
51             
52             var obj = jQuery.parseJSON(d); 
53             console.log(obj)          //
54             console.log(typeof(obj))       //object
55             
56             console.log( obj.name );      //郑秀晶
57             
58         </script>
59     </body>
60 </html>

2) 兼容:浏览器支持的转换方式(Firefox,chrome,opera,safari,ie9,ie8)等浏览器: 

JSON.parse(jsonstr);                     //可以将json字符串转换成json对象  JSON.stringify(jsonobj);               //可以将json对象转换成json对符串 注:ie8(兼容模式),ie7和ie6没有JSON对象,推荐采用JSON官方的方式,引入json.js。

3) JSON官方的转换方式: http://www.json.org/       提供了一个json.js,这样ie8(兼容模式),ie7和ie6就可以支持JSON对象以及其stringify()parse()方法;  可以在https://github.com/douglascrockford/JSON-js上获取到这个js,一般现在用json2.js。

4) Javascript支持的转换方式(eval): eval('(' + jsonstr + ')');                  //可以将json字符串转换成json对象,注意需要在json字符外包裹一对小括号  注:ie8(兼容模式),ie7和ie6也可以使用eval()字符串转为JSON对象,但不推荐这些方式,这种方式不安全eval会执行json串中的表达式。

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>string转object-兼容低版本浏览器(eval实现)</title>
 6     </head>
 7     <body>
 8         <p style="white-space: pre-line; font-size: 18px;">
 9         ie8(兼容模式),ie7和ie6没有JSON对象,不过http://www.json.org/提供了一个json.js,
10         这样ie8(兼容模式),ie7和ie6就可以支持JSON对象以及其stringify()和parse()方法;
11         你可以在https://github.com/douglascrockford/JSON-js上获取到这个js,一般现在用json2.js。
12 
13         ie8(兼容模式),ie7和ie6可以使用eval()将字符串转为JSON对象,
14         eval("("+c+")")
15         </p>
16         
17         <!--兼容ie6/7/8--引入json2.js文件-->
18         <script src="js/json2.js"></script>
19         <script type="text/javascript">
20             
21             var c='{"name":"郑秀晶","sex":"女","age":"23","height":"165","weight":"95g"}';
22             console.log(c);
23             console.log(typeof(c));  //string
24             
25             var cToObj=eval("("+c+")");
26             console.log(typeof(cToObj));       //object
27             
28         </script>
29     </body>
30 </html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏java达人

js的回调函数详解

在Javascript中,函数是第一类对象,这意味着函数可以像对象一样按照第一类管理被使用。既然函数实际上是对象:它们能被“存储”在变量中,能作为函数参数被传递...

37950
来自专栏C/C++基础

C/C++文字常量与常变量

在C/C++编程时,经常遇到以下几个概念:常量、文字常量、字面常量、符号常量、字符常量、常变量、字符串常量等,网上的资料描述的不尽相同,弄得大家云里雾里。本文将...

14320
来自专栏小詹同学

Python系列之——字符串格式化(xiaozhan is a boy of 22 years old.)

不知道小伙伴有没有遇到过字符串输出有格式要求的情况呢?今天小詹学习分享一波python的字符串格式化的方法。学以致用,首先我们得明确为什么要格式化字符串输出,以...

7320
来自专栏Ldpe2G的个人博客

Scala typeclass 设计模式

本文的写作的灵感主要是看了这个视频 : Tutorial: Typeclasses in Scala with Dan Rosen

16560
来自专栏数据结构与算法

洛谷 P2679 子串

题目背景 无 题目描述 有两个仅包含小写英文字母的字符串 A 和 B。现在要从字符串 A 中取出 k 个互不重叠的非空子串,然后把这 k 个子串按照其在字符串 ...

33340
来自专栏IMWeb前端团队

jQuery中的remove和empty区别

说道dom中移出节点,这两个都可以完成。但也有写差别: empty()是只移除了 指定元素中的所有子节点,拿$(“div”).empty()来说,他只是把 移...

21950
来自专栏转载gongluck的CSDN博客

python笔记:#011#循环

循环 目标 程序的三大流程 while 循环基本使用 break 和 continue while 循环嵌套 01. 程序的三大流程 在程序开发中,一共有三种流...

37440
来自专栏十月梦想

JavaScript中类的创建以及类的传参

在之前(ES2015)以前我们常用构造函数来搞定一个事物类,通过new 这个构造函数实现类的功能!在ES6(ES2015)中已经可以使用类,下面我们看一下类如何...

11820
来自专栏飞雪无情的博客

Go语言参数传递是传值还是传引用

其实对于传值和传引用,是一个比较古老的话题,做研发的都有这个概念,但是可能不是非常清楚。对于我们做Go语言开发的来说,也想知道到底是什么传递。

25530
来自专栏web前端教室

web前端零基础课-0908*福祥-学习笔记

学了部分js内容后,完成了网站首页部分动态效果(搜索栏、侧边导航条、轮播图),先用最基本的,冗余最多的一步步实现;后面对Js进行了初步的封装,重新构建了Js文件...

9130

扫码关注云+社区

领取腾讯云代金券