搜尋
首頁web前端js教程一篇文章讓你詳細了解何為JSON

JSON詳解:

JSON的全名是」JavaScript Object Notation”,意思是JavaScript物件表示法,它是一種基於文本,獨立於語言的輕量級資料交換格式。 XML也是一種資料交換格式,為什麼沒有選擇XML呢?因為XML雖然可以作為跨平台的資料交換格式,但是在JS(JavaScript的簡寫)中處理XML非常不方便,同時XML標記比資料多,增加了交換產生的流量,而JSON沒有附加的任何標記,在JS中可作為物件處理,所以我們更傾向於選擇JSON來交換資料。這篇文章主要從以下幾個方面來說明JSON。

1,JSON的兩個結構
2,認識JSON字串
3,在JS中如何使用JSON
4,在.NET中如何使用JSON
5,總結

一、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物件如圖:

一篇文章讓你詳細了解何為JSON

3、修改JSON中的資料

我們現在要修改JSON中count的值,程式碼如下:

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

修改後的JSON如圖:

一篇文章讓你詳細了解何為JSON

4、刪除JSON中的數據

我們現在實作從JSON中刪除count這條數據,程式碼如下:

function Delete() {            
    delete obj.count;//或obj["count"]
}

刪除後的JSON如圖:

一篇文章讓你詳細了解何為JSON

可以看到count已經從JSON物件中被刪除了。

5、便利JSON物件

可以使用for…in…循環來遍歷JSON物件中的數據,例如我們要遍歷輸出obj物件的值,程式碼如下:

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

程式輸出結果為:

一篇文章讓你詳細了解何為JSON

#四、在.NET如何使用JSON

說到在.net中使用JSON,就不得不提到JSON.NET,它是一個非常著名的在.net中處理JSON的工具,我們最常用的是下面兩個功能。

1、透過序列化將.NET物件轉換為JSON字串

在web開發過程中,我們經常需要將從資料庫中查詢到的資料(一般為一個集合,列表或陣列等)轉換為JSON格式字串傳回客戶端,這就需要進行序列化,這裡用到的是JsonConvert物件的SerializeObject方法。

其語法格式為:JsonConvert.SerializeObject(object)

程式碼中的」object」就是要序列化的.net對象,序列化後返回的是json字串。

例如,現在我們有一個TStudent的學生表,表中的欄位和已有資料如圖所示

一篇文章讓你詳細了解何為JSON

一篇文章讓你詳細了解何為JSON

从表中我们可以看到一共有五条数据,现在我们要从数据库中取出这些数据,然后利用JSON.NET的JsonConvert对象序列化它们为json字符串,并显示在页面上。C#代码如下

protected void Page_Load(object sender, EventArgs e)
        {            using (L2SDBDataContext db = new L2SDBDataContext())
            {
                List<Student> studentList = new List<Student>();                var query = from s in db.TStudents                            select new { 
                                StudentID=s.StudentID,
                                Name=s.Name,
                                Hometown=s.Hometown,
                                Gender=s.Gender,
                                Brithday=s.Birthday,
                                ClassID=s.ClassID,
                                Weight=s.Weight,
                                Height=s.Height,
                                Desc=s.Desc
                            };                foreach (var item in query)
                {
                    Student student = new Student { StudentID=item.StudentID,Name=item.Name,Hometown=item.Hometown,Gender=item.Gender,Brithday=item.Brithday,ClassID=item.ClassID,Weight=item.Weight,Height=item.Height,Desc=item.Desc};
                    studentList.Add(student);
                }
                lbMsg.InnerText = JsonConvert.SerializeObject(studentList);
            }
        }

输出结果为:

一篇文章讓你詳細了解何為JSON

从图中我们可以看到,数据库中的5条记录全部取出来并转化为json字符串了。

2,使用LINQ to JSON定制JSON数据

使用JsonConvert对象的SerializeObject只是简单地将一个list或集合转换为json字符串。但是,有的时候我们的前端框架比如ExtJs对服务端返回的数据格式是有一定要求的,比如下面的数据格式,这时就需要用到JSON.NETLINQ to JSON,LINQ to JSON的作用就是根据需要的格式来定制json数据。

比如经常用在分页的json格式如代码:

{ 
    "total": 5, //记录总数
    "rows":[
        //json格式的数据列表
    ]
}

使用LINQ to JSON前,需要引用Newtonsoft.Jsondllusing Newtonsoft.Json.Linq的命名空间。LINQ to JSON主要使用到JObject, JArray, JProperty和JValue这四个对象,JObject用来生成一个JSON对象,简单来说就是生成”{}”,JArray用来生成一个JSON数组,也就是”[]”,JProperty用来生成一个JSON数据,格式为key/value的值,而JValue则直接生成一个JSON值。下面我们就用LINQ to JSON返回上面分页格式的数据。代码如下:

protected void Page_Load(object sender, EventArgs e)
        {
            using (L2SDBDataContext db = new L2SDBDataContext())
            {
                //从数据库中取出数据并放到列表list中
                List<Student> studentList = new List<Student>();
                var query = from s in db.TStudents
                            select new
                            {
                                StudentID = s.StudentID,
                                Name = s.Name,
                                Hometown = s.Hometown,
                                Gender = s.Gender,
                                Brithday = s.Birthday,
                                ClassID = s.ClassID,
                                Weight = s.Weight,
                                Height = s.Height,
                                Desc = s.Desc
                            };
                foreach (var item in query)
                {
                    Student student = new Student { StudentID = item.StudentID, Name = item.Name, Hometown = item.Hometown, Gender = item.Gender, Brithday = item.Brithday, ClassID = item.ClassID, Weight = item.Weight, Height = item.Height, Desc = item.Desc };
                    studentList.Add(student);
                }

                //基于创建的list使用LINQ to JSON创建期望格式的JSON数据
                lbMsg.InnerText = new JObject(
                        new JProperty("total",studentList.Count),
                        new JProperty("rows",
                                new JArray(
                                        //使用LINQ to JSON可直接在select语句中生成JSON数据对象,无须其它转换过程
                                        from p in studentList
                                        select new JObject(
                                                new JProperty("studentID",p.StudentID),
                                                new JProperty("name",p.Name),
                                                new JProperty("homeTown",p.Hometown)
                                            )
                                    )
                            )
                    ).ToString();
            }
        }

输出结果为:

一篇文章讓你詳細了解何為JSON

3、处理客户端提交的客户端数据

客户端提交过来的数据一般都是json字符串,有了更好地进行操作(面向对象的方式),所以我们一般都会想办法将json字符串转换为json对象。例如客户端提交了以下数组格式json字符串。

[
    {StudentID:"100",Name:"aaa",Hometown:"china"},
    {StudentID:"101",Name:"bbb",Hometown:"us"},
    {StudentID:"102",Name:"ccc",Hometown:"england"}
]

在服务端就可以使用JObject或JArray的Parse方法轻松地将json字符串转换为json对象,然后通过对象的方式提取数据。下面是服务端代码。

protected void Page_Load(object sender, EventArgs e)
        {
            string inputJsonString = @"
                [
                    {StudentID:&#39;100&#39;,Name:&#39;aaa&#39;,Hometown:&#39;china&#39;},
                    {StudentID:&#39;101&#39;,Name:&#39;bbb&#39;,Hometown:&#39;us&#39;},
                    {StudentID:&#39;102&#39;,Name:&#39;ccc&#39;,Hometown:&#39;england&#39;}
                ]";
            JArray jsonObj = JArray.Parse(inputJsonString);
            string message = @"<table border=&#39;1&#39;>
                    <tr><td width=&#39;80&#39;>StudentID</td><td width=&#39;100&#39;>Name</td><td width=&#39;100&#39;>Hometown</td></tr>";
            string tpl = "<tr><td>{0}</td><td>{1}</td><td>{2}</td></tr>";
            foreach (JObject jObject in jsonObj)
            {
                message += String.Format(tpl, jObject["StudentID"], jObject["Name"],jObject["Hometown"]);
            }
            message += "</table>";
            lbMsg.InnerHtml = message;
        }

输出结果为:

一篇文章讓你詳細了解何為JSON

当然,服务端除了使用LINQ to JSON来转换json字符串外,也可以使用JsonConvertDeserializeObject方法。如下面代码实现上面同样的功能。

List<Student> studentList = JsonConvert.DeserializeObject<List<Student>>(inputJsonString);//注意这里必须为List<Student>类型,因为客户端提交的是一个数组json
            foreach (Student student in studentList)
            {
                message += String.Format(tpl, student.StudentID, student.Name,student.Hometown);
            }

总结:

在客户端,读写json对象可以使用”.”操作符或”["key”]”,json字符串转换为json对象使用eval()函数。
在服务端,由.net对象转换json字符串优先使用JsonConvert对象的SerializeObject方法,定制输出json字符串使用LINQ to JSON。由json字符串转换为.net对象优先使用JsonConvert对象的DeserializeObject方法,然后也可以使用LINQ to JSON。

想了解更多相关内容请访问PHP中文网:JSON视频教程

以上是一篇文章讓你詳細了解何為JSON的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文轉載於:博客园。如有侵權,請聯絡admin@php.cn刪除
Python vs. JavaScript:您應該學到哪種語言?Python vs. JavaScript:您應該學到哪種語言?May 03, 2025 am 12:10 AM

選擇Python還是JavaScript應基於職業發展、學習曲線和生態系統:1)職業發展:Python適合數據科學和後端開發,JavaScript適合前端和全棧開發。 2)學習曲線:Python語法簡潔,適合初學者;JavaScript語法靈活。 3)生態系統:Python有豐富的科學計算庫,JavaScript有強大的前端框架。

JavaScript框架:為現代網絡開發提供動力JavaScript框架:為現代網絡開發提供動力May 02, 2025 am 12:04 AM

JavaScript框架的強大之處在於簡化開發、提升用戶體驗和應用性能。選擇框架時應考慮:1.項目規模和復雜度,2.團隊經驗,3.生態系統和社區支持。

JavaScript,C和瀏覽器之間的關係JavaScript,C和瀏覽器之間的關係May 01, 2025 am 12:06 AM

引言我知道你可能會覺得奇怪,JavaScript、C 和瀏覽器之間到底有什麼關係?它們之間看似毫無關聯,但實際上,它們在現代網絡開發中扮演著非常重要的角色。今天我們就來深入探討一下這三者之間的緊密聯繫。通過這篇文章,你將了解到JavaScript如何在瀏覽器中運行,C 在瀏覽器引擎中的作用,以及它們如何共同推動網頁的渲染和交互。 JavaScript與瀏覽器的關係我們都知道,JavaScript是前端開發的核心語言,它直接在瀏覽器中運行,讓網頁變得生動有趣。你是否曾經想過,為什麼JavaScr

node.js流帶打字稿node.js流帶打字稿Apr 30, 2025 am 08:22 AM

Node.js擅長於高效I/O,這在很大程度上要歸功於流。 流媒體匯總處理數據,避免內存過載 - 大型文件,網絡任務和實時應用程序的理想。將流與打字稿的類型安全結合起來創建POWE

Python vs. JavaScript:性能和效率注意事項Python vs. JavaScript:性能和效率注意事項Apr 30, 2025 am 12:08 AM

Python和JavaScript在性能和效率方面的差異主要體現在:1)Python作為解釋型語言,運行速度較慢,但開發效率高,適合快速原型開發;2)JavaScript在瀏覽器中受限於單線程,但在Node.js中可利用多線程和異步I/O提升性能,兩者在實際項目中各有優勢。

JavaScript的起源:探索其實施語言JavaScript的起源:探索其實施語言Apr 29, 2025 am 12:51 AM

JavaScript起源於1995年,由布蘭登·艾克創造,實現語言為C語言。 1.C語言為JavaScript提供了高性能和系統級編程能力。 2.JavaScript的內存管理和性能優化依賴於C語言。 3.C語言的跨平台特性幫助JavaScript在不同操作系統上高效運行。

幕後:什麼語言能力JavaScript?幕後:什麼語言能力JavaScript?Apr 28, 2025 am 12:01 AM

JavaScript在瀏覽器和Node.js環境中運行,依賴JavaScript引擎解析和執行代碼。 1)解析階段生成抽象語法樹(AST);2)編譯階段將AST轉換為字節碼或機器碼;3)執行階段執行編譯後的代碼。

Python和JavaScript的未來:趨勢和預測Python和JavaScript的未來:趨勢和預測Apr 27, 2025 am 12:21 AM

Python和JavaScript的未來趨勢包括:1.Python將鞏固在科學計算和AI領域的地位,2.JavaScript將推動Web技術發展,3.跨平台開發將成為熱門,4.性能優化將是重點。兩者都將繼續在各自領域擴展應用場景,並在性能上有更多突破。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

SublimeText3 英文版

SublimeText3 英文版

推薦:為Win版本,支援程式碼提示!

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器

VSCode Windows 64位元 下載

VSCode Windows 64位元 下載

微軟推出的免費、功能強大的一款IDE編輯器