文档章节

JSON详解

听风看月
 听风看月
发布于 2017/04/15 01:11
字数 1493
阅读 28
收藏 2

阅读目录

JSON的全称是”JavaScript Object Notation”,意思是JavaScript对象表示法,它是一种基于文本,独立于语言的轻量级数据交换格式。XML也是一种数据交换格式,为什么没有选择XML呢?因为XML虽然可以作为跨平台的数据交换格式,但是在JS(JavaScript的简写)中处理XML非常不方便,同时XML标记比数据多,增加了交换产生的流量,而JSON没有附加的任何标记,在JS中可作为对象处理,所以我们更倾向于选择JSON来交换数据。这篇文章主要从以下几个方面来说明JSON。

JSON的两种结构

JSON有两种表示结构,对象和数组。
对象结构以”{”大括号开始,以”}”大括号结束。中间部分由0或多个以”,”分隔的”key(关键字)/value(值)”对构成,关键字和值之间以”:”分隔,语法结构如代码。

{
    key1:value1,
    key2:value2,
    ...
}

其中关键字是字符串,而值可以是字符串,数值,true,false,null,对象或数组

数组结构以”[”开始,”]”结束。中间由0或多个以”,”分隔的值列表组成,语法结构如代码。

[
    {
        key1:value1,
        key2:value2 
    },
    {
         key3:value3,
         key4:value4   
    }
]

认识JSON字符串

        之前我一直有个困惑,分不清普通字符串,json字符串和json对象的区别。经过一番研究终于给弄明白了。比如在js中。

字符串:这个很好解释,指使用“”双引号或’’单引号包括的字符。例如:var comStr = 'this is string';
json字符串:指的是符合json格式要求的js字符串。例如:var jsonStr = "{StudentID:'100',Name:'tmac',Hometown:'usa'}";
json对象:指符合json格式要求的js对象。例如:var jsonObj = { StudentID: "100", Name: "tmac", Hometown: "usa" };

在JS中如何使用JSON

        JSON是JS的一个子集,所以可以在JS中轻松地读,写JSON。读和写JSON都有两种方法,分别是利用”.”操作符和“[key]”的方式。
我们首先定义一个JSON对象,代码如下。

var obj = {
            1: "value1",
            "2": "value2",
            count: 3,
            person: [ //数组结构JSON对象,可以嵌套使用
                        {
                            id: 1,
                            name: "张三"
                        },
                        {
                            id: 2,
                            name: "李四"
                        }
                   ],
            object: { //对象结构JSON对象
                id: 1,
                msg: "对象里的对象"    
            }
        };

1,从JSON中读数据

function ReadJSON() {
            alert(obj.1); //会报语法错误,可以用alert(obj["1"]);说明数字最好不要做关键字
            alert(obj.2); //同上

            alert(obj.person[0].name); //或者alert(obj.person[0]["name"])
            alert(obj.object.msg); //或者alert(obj.object["msg"])
        }

2,向JSON中写数据

比如要往JSON中增加一条数据,代码如下:

function Add() { 
            //往JSON对象中增加了一条记录
            obj.sex= "男" //或者obj["sex"]="男"
        }

增加数据后的JSON对象如图:

json01

3,修改JSON中的数据

我们现在要修改JSON中count的值,代码如下:

function Update() {
            obj.count = 10; //或obj["count"]=10
        }

修改后的JSON如图。

json02

4,删除JSON中的数据

我们现在实现从JSON中删除count这条数据,代码如下:

function Delete() {
            delete obj.count;
        }

删除后的JSON如图

json03

可以看到count已经从JSON对象中被删除了。

5,遍历JSON对象

可以使用for…in…循环来遍历JSON对象中的数据,比如我们要遍历输出obj对象的值,代码如下:

function Traversal() {
            for (var c in obj) {
                console.log(c + ":", obj[c]);
            }
        }

程序输出结果为:

json04

ajax中JSON.stringify()和JSON.parse()方法的使用

我们平时使用ajax向后台传递数据时,通常会传递json格式的数据,当然这里还有其它格式,比如xml、html、script、text、jsonp格式。

json类型的数据包含json对象和json类型的字符串

JSON.stringify(),将JSON对象转换为JSON类型的字符串

JSON.parse(),将JSON类型的字符串转换为JSON对象

1、直接传递json对象,示例如下:

<span style="font-size:14px;"><script>  
var jsondata={"Participant":[{"Name_1":"1","Position_1":"1","Tel_1":"1","Mobile_1":"1","Ohter_1":"1"},{"Name_2":"1","Position_2":"1","Tel_2":"2","Mobile_2":"2","Ohter_2":"2"}]}  
$.ajax({  
                type: "POST",  
                contentType: "application/json;charset=utf-8",  
                url: "ApplyEdit.aspx/SaveParticipant",  
                data: jsondata,  
                dataType: "json",  
                complete: function () { },  
                success: function (result) {  
                },  
                error: function (result, status) { }  
            });  
</script></span>  

2、使用JSON.stringify(),将JSON对象转换为JSON类型的字符串示例如下:

<span style="font-size:14px;"><script>  
var jsondata={"Participant":[{"Name_1":"1","Position_1":"1","Tel_1":"1","Mobile_1":"1","Ohter_1":"1"},{"Name_2":"1","Position_2":"1","Tel_2":"2","Mobile_2":"2","Ohter_2":"2"}]}  
$.ajax({  
                type: "POST",  
                contentType: "application/json;charset=utf-8",  
                url: "ApplyEdit.aspx/SaveParticipant",  
                data: JSON.stringify(jsondata),  
                dataType: "json",  
                complete: function () { },  
                success: function (result) {  
                },  
                error: function (result, status) { }  
            });  
</script></span>  

3、直接传递JSON类型的字符串,如下:

<span style="font-size:14px;"><script>  
var jsondata="{\"name\":\""+name+"\",\"password\":\""+password+"\"}";  
$.ajax({  
                type: "POST",  
                contentType: "application/json;charset=utf-8",  
                url: "ApplyEdit.aspx/SaveParticipant",  
                data: jsondata,  
                dataType: "json",  
                complete: function () { },  
                success: function (result) {  
                },  
                error: function (result, status) { }  
            });  
</script></span>  

4、使用JSON.parse(),将JSON类型的字符串转换为JSON对象,示例如下:

<span style="font-size:14px;"><script>  
var jsondata="{\"name\":\""+name+"\",\"password\":\""+password+"\"}";  
$.ajax({  
                type: "POST",  
                contentType: "application/json;charset=utf-8",  
                url: "ApplyEdit.aspx/SaveParticipant",  
                data: JSON.parse(jsondata),  
                dataType: "json",  
                complete: function () { },  
                success: function (result) {  
                },  
                error: function (result, status) { }  
            });  
</script></span>  

这两种方法不能乱用,一不小心的话就会导致后台解析不了数据,正确的用法在上面。 
stringify是将Json转义,parseJSON是将json去除转义并解析成对象 

注意:

一、contentType

contentType,可以是application/x-www-form-urlencoded这种默认类型的,不过当后台有struts等框架的话,会在action之前拦截请求,并把request body 里面的值都读出来,导致我们不能再request里面读取到值,只能依赖struts的domain model 
所有如果有后台用这种机制的话,那就需要更改contentType:application/json,这样子strust就不会拦截请求了

前台虽然看上去一个json,但其实后台获取的时候还是一个字符串。只不过java后台你可以通过JSONObject jsonObject = JSONObject.fromObject(s);解析

图片说明,其中那个TerminalID就相当于你的name、eMail一样的东西,获得的值是 名称、电子邮箱一样的东西。

 

© 著作权归作者所有

共有 人打赏支持
听风看月
粉丝 2
博文 33
码字总数 39100
作品 0
深圳
程序员
私信 提问

暂无文章

腾讯面试:一条SQL语句执行得很慢的原因有哪些?

说实话,这个问题可以涉及到 MySQL 的很多核心知识,可以扯出一大堆,就像要考你计算机网络的知识时,问你“输入URL回车之后,究竟发生了什么”一样,看看你能说出多少了。 之前腾讯面试的实...

java菜分享
25分钟前
4
0
Java 基本功 之 CAS

本文首发于个人公众号《andyqian》, 期待你的关注! 前言 在Java并发编程中,我们经常使用锁对竞争资源予以并发控制,以解决资源竞争的问题。但无论是使用 Lock 还是 Synchronized,随着锁机...

andyqian
28分钟前
3
0
信号量与条件变量的区别

注意信号量与条件变量的区别 信号量内容可见:http://www.cnblogs.com/charlesblc/p/6142868.html 信号量、共享内存,以及消息队列等System V IPC三剑客主要关注进程间通信; 而条件变量、互...

shzwork
39分钟前
0
0
在VirtualBox 6.0中安装fedora 30

操作系统安装完毕后首先进行更新。 sudo dnf update 重启虚拟机后,安装VirtualBox依赖的软件包。 sudo dnf install kernel-headers kernel-devel dkms gcc 最后,安装“增强功能”。...

gugudu
48分钟前
0
0
861. Score After Flipping Matrix

为了获得最大值,我们必须保证每一行列下标小的1尽可能的多(最高位的1尽可能多)。 首先,考虑我们可以进行的操作有 翻转列,进行列操作 翻转行,进行行操作 通过行操作 我们总是可以使得第...

reter
48分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部