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>