JSON 语法

JSON 语法规则

在 JS 语言中,一切都是对象。因此,任何支持的类型都可以通过 JSON 来表示,例如字符串、数字、对象、数组等。但是对象和数组是比较特殊且常用的两种类型:
  • 对象表示为键值对
  • 数据由逗号分隔
  • 花括号保存对象
  • 方括号保存数组

JSON 键/值对

JSON 键值对是用来保存 JS 对象的一种方式,和 JS 对象的写法也大同小异,键/值对组合中的键名写在前面并用双引号 "" 包裹,使用冒号 : 分隔,然后紧接着值:
1
{"firstName": "Json"}
这很容易理解,等价于这条 JavaScript 语句:
1
{firstName : "Json"}

JSON 与 JS 对象的关系

很多人搞不清楚 JSON 和 Js 对象的关系,甚至连谁是谁都不清楚。其实,可以这么理解:
JSON 是 JS 对象的字符串表示法,它使用文本表示一个 JS 对象的信息,本质是一个字符串。
1
var obj = {a: 'Hello', b: 'World'}; //这是一个对象,注意键名也是可以使用引号包裹的
1
var json = '{"a": "Hello", "b": "World"}'//这是一个 JSON 字符串,本质是一个字符串

JSON 和 JS 对象互转

要实现从对象转换为 JSON 字符串,使用 JSON.stringify() 方法:
 
 
var json = JSON.stringify({a: 'Hello', b: 'World'}); //结果是 '{"a": "Hello", "b": "World"}'
要实现从 JSON 转换为对象,使用 JSON.parse() 方法:
 
 
var obj = JSON.parse('{"a": "Hello", "b": "World"}'); //结果是 {a: 'Hello', b: 'World'}
  1. //使用json中的parser方法转换;
  2.  
  3. var str='{"name":"fendouer", "age":23}'; //这是一个json字符串''
  4. var ob=JSON.parse(str) ; //返回一个新对象
  5. console.log(ob.name)

  6. //把json中的stringify对象转换成字符串
  7. var obj={"student":[{"name":"cyl","age":"21"},{"name":"hyj","age":"23"}]}; //这是一个json对象
  8. var str=obj.student[0].name;
  9. var newstr=JSON.stringify(str); //返回一个新字符串
  10. console.log(newstr);

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

简单栗子:

  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)对象。当然如果有兴趣可以自己封装一个jquery扩展,jQuery.stringifyJSON(obj)将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>

json对象与字符串相互转换的更多相关文章

  1. js JSON对象与字符串相互转换

    从服务器接收到数据一般是字符串的形式.如果是JSON格式的字符串,就需要先将其转换成JSON对象.JSON对象在浏览器输出为objcet,我们看不到具体的数据.所以将JSON对象转换成字符串. 下面将 ...

  2. JSON对象与XML相互转换工具类

    依赖jar <dependency> <groupId>dom4j</groupId> <artifactId>dom4j</artifactId ...

  3. json对象与string相互转换教程

    一.说明 1.1 背景说明 json对象与string相互转换,这东西想写了很多次,但总觉得网上教程比较成熟,所以之前每次都放弃了.但今天又被string转json对象折腾了半天,实在受不了,所以还是 ...

  4. js中的json对象和字符串之间的转化

    字符串转对象(strJSON代表json字符串)   var obj = eval(strJSON);   var obj = strJSON.parseJSON();   var obj = JSO ...

  5. json对象转字符串与json字符串转对象

    1.概述: 我们在编程时进场会遇到json对象转字符串,或者字符串转对象的情况. 2.解决办法: json.parse()方法是将json字符串转成json对象. json.stringfy()方法是 ...

  6. json对象与字符串的相互转换,数组和字符串的转换

    1.json对象转换为字符串 JSON.stringify(value [, replacer] [, space])  var student = new Object(); student.id ...

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

    JSON.stringify(obj)       将JSON对象转为字符串. JSON.parse(string)       将字符串转为JSON对象格式. 后台给你数据的时候,有时候会给你字符串 ...

  8. jquery转换json对象为字符串

    jquery转换json对象为字符串 JSON.stringify(jsonObject),可用于单个JSON对象,也可用于JSON数组 alert(JSON.stringify(jsonObject ...

  9. jquery,字符串转json对象,json对象转字符串

    字符串转json对象 方法一:var json = eval('(' + str + ')'); 方法二:return JSON.parse(str); json对象转字符串 JSON.stringi ...

随机推荐

  1. thinkphp3.2.3 ueditor1.4.3 图片上传操作,在线删除上传图片功能。

    最近弄一个图片 上传,可是用ueditor 自带的上传,如果不配置的话,上传的目录不在自己的项目中. 在网上找了好多,可是都是底版本的,新版本的还真是找到了一个,ueditor-thinkphp 这个 ...

  2. Linux 启动盘命令

    linux下有很多工具可以制作启动盘, 例如 unetbootin 和 wubi, 不过我们可以使用linux下的一条命令来完成-----dd 操作方法: 1 卸载你的U盘 假设你的u盘对应的设备是s ...

  3. 通过一个例子,总结下检测数组属性的N种方法

    判断arr数组里是否含有a,有a返回1;没有返回2var arr = [{a:1,b:2,c:3},{q:1,w:2,e:3},{s:4,g:5,i:9},{b:2,v:3,u:4}]; 检测属性的3 ...

  4. 简简单单谈WCF

    另一个系统去访问另一个系统,就是需要使用到分布式通讯咯.. 1. webService   .netfromwork3.5中存在 2. webapi 3. Wcf    scop通讯协议 以上三种都是 ...

  5. spring boot Configuration Annotation Proessor not found in classpath

    出现spring boot Configuration Annotation Proessor not found in classpath的提示是在用了@ConfigurationPropertie ...

  6. input输入框不能获得焦点

    今天在ipad上遇到一个问题:jquery 调用 $(id).focus() 方法,失效,不能弹出键盘获得输入的焦点. 开始以为是 $(id).focus() 方法的问题,然后就试着用原声的docum ...

  7. 【Android学习入门】Android studio基本设置

    1.背景设置 依次选择File->Settings-->Appearance & Behaviour->Apprearance,然后勾选 show line number. ...

  8. 《ArcGIS Runtime SDK for Android开发笔记》——(3)、ArcGIS Runtime SDK概述

    1.前言 ArcGIS Runtime SDK是一整套用于构建原生及跨平台的地图应用程序的开发包,包括移动设备的Android.iOS.Windows Phone,针对桌面的.Net.Java.OSX ...

  9. arm寄存器解析

    寒假闲来无事准备将自己的走过的arm之路总结一下,今天就先从arm的寄存器说起吧,欢迎各位拍砖. 要介绍arm寄存器之前我们要先了解一下arm处理器的工作模式: Arm处理器有七种工作模式,为的是形成 ...

  10. HCNA配置console线路密码aaa认证

    Please check whether system data has been changed, and save data in time Configuration console time ...