JSON基础
一、JSON简介
JSON,全称“JavaScript Object Notation(JavaScript对象表示法)”,起源于JavaScript的对象和数组。JSON,说白了就是JavaScript用来处理数据的一种格式,这种格式非常简单易用,不过没有XML通用。
JSON,大部分都是用来处理JavaScript和web服务器端之间的数据交换,把后台web服务器的数据传递到前台,然后使用JavaScript进行处理,例如ajax等。
JSON支持的语言非常多,包括JavaScript、C#、PHP、Java等等,这是由于JSON独立于语言的轻量级的数据交换格式,这个特点有点类似于SQL语言。
JSON,就是一种数据传输格式而已,无它,非常容易掌握。但是大家不要误以为JSON最大的用处是在前端,其实JSON最大的用处是处理JavaScript和web服务器端之间数据交换。
对于JSON的学习,前半部分对于有前端基础的人也可以学习,不过呢对于JSON教程后半部分就得需要有后端技术基础了,因为JSON最大的好处就在于处理前端和web服务器端之间数据交换。
1.1 JSON对象结构
JSON结构共有2种:
(1)对象结构;
(2)数组结构;
JSON,简单来说就是JavaScript中的对象或数组,所以这两种结构就是对象和数组。通过这两种结构就可以表示各种复杂的结构。
这一节我们先来认识一下JSON对象结构。
一、JSON对象结构
对象结构是使用大括号“{}”括起来的,大括号内是由0个或多个用英文逗号分隔的“关键字:值”对(key:value)构成的。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> var obj = { "name":"helicopter", "age":23, "gender":"男", //JSON对象内部也有一个JSON对象 hobby: { "first":"swimming", "second":"singing", "third":"dancing" } } delete obj.age; if(obj.age==null) { alert("JSON中的年龄项已经被删除!"); } </script> </head> <body> </body> </html>
1、从JSON中读数据
jsonObj.key
jsonObj["key"]
2、向JSON写数据
3、修改JSON中的数据
4、删除JSON中的数据
delete jsonObj.key;
5、遍历JSON对象
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> var obj = { "name":"helicopter", "age":23, "gender":"男", } for(var c in obj) { if(c=="name") { document.write("姓名是:"+obj[c]); } } </script> </head> <body> </body> </html>
1.2 JSON数组结构
对于获取、写入、修改、删除、遍历JSON数组结构中的数据,跟JSON对象结构的数据操作类似
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> var arr = [ { "name":"小明", "age":23, "gender":"男" }, { "name":"小红", "age":21, "gender":"女" } ] //读取JSON数据 document.write("第一个学生的名字是:"+arr[0].name+"<br>"); document.write("第二个学生的性别是:"+arr[1].gender+"<br>"); </script> </head> <body> </body> </html>
1.3 JSON对象和JSON字符串
普通字符串,大家都知道是使用单引号或双引号括起来的一串字符。
JSON对象,指的是符合JSON格式要求的JavaScript对象。
JSON字符串,指的是符合“JSON格式”的字符串。
var str = "json教程"; //普通字符串
var jsonObj = {"name":"helicopter","age":23,"gender":"男"}; //json对象
var jsonStr = '{"name": "helicopter", "age":23, "gender": "男"}'; //json字符串
JSON字符串要求两点:
(1)必须是字符串,也就是要用单引号或双引号括起来;
(2)必须符合“JSON”格式。
在JSON中,可以使用JSON.stringify()方法将JSON对象转换为JSON字符串,JSON.parse()方法来将JSON字符串转换为JSON对象
var jsonStr=JSON.stringify(obj);
var jsonObj=JSON.parse(jsonStr);
在JavaScript中,将JSON字符串转换为JSON对象非常有用。一般,在Web服务器后台向前台传输数据的过程中,往往都是用字符串形式来传输JSON数据。如果我们在前台想要获取JSON数据,就必须将JSON字符串转换为JSON对象才能操作。
现在大多数浏览器(IE8及以上,Chrome和Firefox差不多全部)自带原生JSON对象,提供JSON.parse()方法来将JSON字符串转换为JSON对象。
1.4 JSON在线解析工具
http://www.lvyestudy.com/tools/json_editor.aspx