JSON简介及应用-优快云博客

上一个视频播放例子是通过ajax实现的，异步刷新的好处我们已经体会到了，此外ajax传递复杂数据如果自己进行格式定义的话会经历组装、解析的过程，因为ajax中有一个事实上的数据传输标准Json。那我们来介绍一下吧。

1. 基础

Ø 定义

JSON(JavaScriptObject Notation) 是一种轻量级的数据交换格式。它基于JavaScript（StandardECMA-262 3rd Edition - December 1999）的一个子集。 JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C, C++, C#, Java, JavaScript,Perl, Python等）。这些特性使JSON成为理想的数据交换语言。易于人阅读和编写，同时也易于机器解析和生成(网络传输速度快)。

Ø 特点

Json（是一个标准，就像XML一样，规定了对象以什么样的格式保存为一个字符串）将复杂对象序列化为一个字符串，在浏览器端再将字符串反序列化为javascript可读取的对象。其几乎为所有的语言所支持。

Ø 来源

特点提到是像XML文件一样的，在ajax中，我们提高创建对象XMLHTTPRequset，看到前面是XML，最初的时候是为了解析和传递XML文件，可是我们通常发的是一些普通的文本或者字符串，当然xml格式存在一些缺点：Xml的缺点是太占空间，因为XML下面都是一个接着一个节点，这样必然占用很大的空间。为了降低数据流量，发明了json；类似于xml。传递数据，占的体积更少而已。

Xml包含的东西很复杂，并且占的空间大，如图：

Ø 用法

C#中将.NET对象序列化为一个Json字符串的方法：JavascriptSerializer().Serializer(p),JavascriptSerializer在System.Web.Extensions.dll中，是.Net3.x中新增加的类，如果在.NET2.0中则需要用第三方控件。

Ø JS解析Json

有的资料介绍了eval解析Json，这样存在不安全性，jquery等库提供了解析json的方法，有的浏览器支持json.parse;不支持的引用json2.js也是可以的。注意js对数组的变量也要for（vari=0;i<persons.length;i++）

2. 应用

Ø 举例

第一步：新建一个person类

<span style="font-family:Microsoft YaHei;font-size:14px;"><strong>using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace json
{
    public class person
    {
        public string Name { get; set; }
        public string Age { get; set; }
        public string Email{ get; set; }
    }
}</strong></span>

新建处理程序为json.ashx（获得一个对象的json格式，即将对象序列化）

<span style="font-family:Microsoft YaHei;font-size:14px;"><strong>using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;

namespace json
{
    /// <summary>
    /// json 的摘要说明
    /// </summary>
    public class json : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            //context.Response.ContentType = "text/plain";
            context.Response.ContentType = "text/html";
            
            List<person> list = new List<person>();
            list.Add(new person { Name = "lxn", Age = "25", Email = "1234567@qq.com" });
            list.Add(new person { Name = "wzp", Age = "25", Email = "1234567@163.com" });
            list.Add(new person{ Name = "lxl", Age = "24", Email = "1234567@126.com" });
           

            JavaScriptSerializer jss = new JavaScriptSerializer(); //定义一个序列化的串
            //获取的是一个数组，将其序列化
            //string json= jss.Serialize(list);  //将list序列化
            //获取的是一个对象，将一个对象序列化
            string json = jss.Serialize(new person { Name = "lxl", Age = "24", Email = "1234567@126.com" });
            context.Response.Write(json);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}</strong></span>

新建html页为jsonHtml（Jsonhtml，将序列化的字符串转化为javascript对象）

<span style="font-family:Microsoft YaHei;font-size:14px;"><strong><!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Json例子</title>
    <script src="ajax.js" type="text/javascript"></script>
    <script type="text/javascript">
        function go()
        {
            ajax("json.ashx", function (resTxt) {
               var p = JSON.parse(resTxt); //p为一个对象
                alert("姓名:" + p.Name + ";年龄：" + p.Age)
                  
                //alert(resTxt);
                //对数组式的进行遍历
                //var persons = JSON.parse(resTxt);
                //for (var i = 0; i < persons.length; i++) {
                //    var p = persons[i];
                //    alert("姓名:" + p.Name + ";年龄：" + p.Age)

                //}
            });

        }
    </script>
</head>
<body onload="go()">

</body>
</html>
</strong></span>

ajax交互页面：

<span style="font-family:Microsoft YaHei;font-size:14px;"><strong>function ajax(url, onsuccess) {
    var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); //创建XMLHTTP对象，考虑兼容性。XHR
    xmlhttp.open("POST", url, true); //“准备”向服务器的GetDate1.ashx发出Post请求（GET可能会有缓存问题）。这里还没有发出请求

    //DRY：不要复制粘贴代码
    //AJAX是异步的，并不是等到服务器端返回才继续执行
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4) //readyState == 4 表示服务器返回完成数据了。之前可能会经历2（请求已发送，正在处理中）、3（响应中已有部分数据可用了，但是服务器还没有完成响应的生成）
        {
            if (xmlhttp.status == 200) //如果Http状态码为200则是成功
            {
                onsuccess(xmlhttp.responseText);
            }
            else {
                alert("AJAX服务器返回错误！");
            }
        }
    }
    //不要以为if (xmlhttp.readyState == 4) {在send之前执行！！！！
    xmlhttp.send(); //这时才开始发送请求。并不等于服务器端返回。请求发出去了，我不等！去监听onreadystatechange吧！
}</strong></span>

注解：在服务器端通过上面的把一个对象转换为json字符串，在客户端通过json.parse将其转为对象，是一个对应的关系。Json.js应对不支持的parse的，实现兼容。产生的效果自己动手试试吧。

同样我们也可以对数组形式进行转化，在html页用for对其进行遍历即可。

其他同对象转换，只是需要修改部分代码即可，如下：

html页面：

<span style="font-family:Microsoft YaHei;font-size:14px;"><strong> function go()
        {
            ajax("json.ashx", function (resTxt) {
               //var p = JSON.parse(resTxt); //p为一个对象
               // alert("姓名:" + p.Name + ";年龄：" + p.Age)
                //    )
                //alert(resTxt);
                //对数组式的进行遍历
                var persons = JSON.parse(resTxt);
                for (var i = 0; i < persons.length; i++) {
                    var p = persons[i];
                    alert("姓名:" + p.Name + ";年龄：" + p.Age)

                }
            });

        }</strong></span>

一般处理程序面：

<span style="font-family:Microsoft YaHei;font-size:14px;"><strong>  public void ProcessRequest(HttpContext context)
        {
            //context.Response.ContentType = "text/plain";
            context.Response.ContentType = "text/html";
            
            List<person> list = new List<person>();
            list.Add(new person { Name = "lxn", Age = "25", Email = "1234567@qq.com" });
            list.Add(new person { Name = "wzp", Age = "25", Email = "1234567@163.com" });
            list.Add(new person{ Name = "lxl", Age = "24", Email = "1234567@126.com" });
           

            JavaScriptSerializer jss = new JavaScriptSerializer(); //定义一个序列化的串
            //获取的是一个数组，将其序列化
            string json= jss.Serialize(list);  //将list序列化
            //获取的是一个对象，将一个对象序列化
            //string json = jss.Serialize(new person { Name = "lxl", Age = "24", Email = "1234567@126.com" });
            context.Response.Write(json);
        }</strong></span>