以下內(nèi)容來(lái)自W3school。

JSON：JavaScript 對(duì)象表示法（JavaScript Object Notation）。

JSON 是存儲(chǔ)和交換文本信息的語(yǔ)法。類似 XML。?

JSON 比 XML 更小、更快，更易解析。

?什么是 JSON ？

?JSON 指的是 JavaScript 對(duì)象表示法（JavaScript Object Notation）

?JSON 是輕量級(jí)的文本數(shù)據(jù)交換格式

?JSON 獨(dú)立于語(yǔ)言 *

??JSON 具有自我描述性，更易理解

?

* JSON 使用 JavaScript 語(yǔ)法來(lái)描述數(shù)據(jù)對(duì)象，但是 JSON 仍然獨(dú)立于語(yǔ)言和平臺(tái)。JSON 解析器和 JSON 庫(kù)支持許多不同的編程語(yǔ)言。

?

JSON - 轉(zhuǎn)換為 JavaScript 對(duì)象

JSON 文本格式在語(yǔ)法上與創(chuàng)建 JavaScript 對(duì)象的代碼相同。

?由于這種相似性，無(wú)需解析器，JavaScript 程序能夠使用內(nèi)建的 eval() 函數(shù)，用 JSON 數(shù)據(jù)來(lái)生成原生的 JavaScript 對(duì)象。

?

一、JSON 簡(jiǎn)介

類似 XML

?JSON 是純文本

?JSON 具有“自我描述性”（人類可讀）

?JSON 具有層級(jí)結(jié)構(gòu)（值中存在值）

?JSON 可通過(guò) JavaScript 進(jìn)行解析

?JSON 數(shù)據(jù)可使用 AJAX 進(jìn)行傳輸

??

相比 XML 的不同之處

?沒(méi)有結(jié)束標(biāo)簽

?更短

?讀寫的速度更快

?能夠使用內(nèi)建的 JavaScript eval() 方法進(jìn)行解析

?使用數(shù)組

?不使用保留字

??

為什么使用 JSON？

?對(duì)于 AJAX 應(yīng)用程序來(lái)說(shuō)，JSON 比 XML 更快更易使用：

?

使用 XML

?讀取 XML 文檔

?使用 XML DOM 來(lái)循環(huán)遍歷文檔

?讀取值并存儲(chǔ)在變量中

?

使用 JSON

?讀取 JSON 字符串

??用 eval() 處理 JSON 字符串?

二、JSON語(yǔ)法

JSON 語(yǔ)法是 JavaScript 語(yǔ)法的子集。

??

JSON 語(yǔ)法規(guī)則

?JSON 語(yǔ)法是 JavaScript 對(duì)象表示法語(yǔ)法的子集。

?數(shù)據(jù)在名稱/值對(duì)中

?數(shù)據(jù)由逗號(hào)分隔

?花括號(hào)保存對(duì)象

??方括號(hào)保存數(shù)組

?

JSON 名稱/值對(duì)

JSON 數(shù)據(jù)的書寫格式是：名稱/值對(duì)。

名稱/值對(duì)包括字段名稱（在雙引號(hào)中），后面寫一個(gè)冒號(hào)，然后是值：

Js代碼

"firstName"?:?"John"??

"firstName" : "John"

?這很容易理解，等價(jià)于這條 JavaScript 語(yǔ)句：

Js代碼

firstName?=?"John"??

firstName = "John"

JSON 值

JSON 值可以是：

?數(shù)字（整數(shù)或浮點(diǎn)數(shù)）

?字符串（在雙引號(hào)中）

?邏輯值（true 或 false）

?數(shù)組（在方括號(hào)中）

?對(duì)象（在花括號(hào)中）

?null

?

JSON 對(duì)象

JSON 對(duì)象在花括號(hào)中書寫：

對(duì)象可以包含多個(gè)名稱/值對(duì)：

Js代碼

{?"firstName":"John"?,?"lastName":"Doe"?}??

{ "firstName":"John" , "lastName":"Doe" }

?這一點(diǎn)也容易理解，與這條 JavaScript 語(yǔ)句等價(jià)：

Js代碼

firstName?=?"John"??

lastName?=?"Doe"??

firstName = "John" lastName = "Doe"

?

JSON 數(shù)組

JSON 數(shù)組在方括號(hào)中書寫：

數(shù)組可包含多個(gè)對(duì)象：

Js代碼

{ ??

????"employees":?[ ??

????????{?"firstName":"John"?,?"lastName":"Doe"?}, ??

????????{?"firstName":"Anna"?,?"lastName":"Smith"?}, ??

????????{?"firstName":"Peter"?,?"lastName":"Jones"?} ??

????] ??

}??

{"employees": [{ "firstName":"John" , "lastName":"Doe" },{ "firstName":"Anna" , "lastName":"Smith" },{ "firstName":"Peter" , "lastName":"Jones" }] }

?在上面的例子中，對(duì)象 "employees" 是包含三個(gè)對(duì)象的數(shù)組。每個(gè)對(duì)象代表一條關(guān)于某人（有姓和名）的記錄。

?

JSON 使用 JavaScript 語(yǔ)法

因?yàn)?JSON 使用 JavaScript 語(yǔ)法，所以無(wú)需額外的軟件就能處理 JavaScript 中的 JSON。?

通過(guò) JavaScript，您可以創(chuàng)建一個(gè)對(duì)象數(shù)組，并像這樣進(jìn)行賦值：

例子：

Js代碼

var?employees?=?[ ??

????{?"firstName":"Bill"?,?"lastName":"Gates"?}, ??

????{?"firstName":"George"?,?"lastName":"Bush"?}, ??

????{?"firstName":"Thomas"?,?"lastName":?"Carter"?} ??

];??

var employees = [{ "firstName":"Bill" , "lastName":"Gates" },{ "firstName":"George" , "lastName":"Bush" },{ "firstName":"Thomas" , "lastName": "Carter" } ];

?可以像這樣訪問(wèn) JavaScript 對(duì)象數(shù)組中的第一項(xiàng)：

Js代碼 ?

employees[0].lastName;??

employees[0].lastName;

?返回的內(nèi)容是：

Js代碼 ?

Gates??

Gates

?可以像這樣修改數(shù)據(jù)：

Js代碼 ?

employees[0].lastName?=?"Jobs";??

employees[0].lastName = "Jobs";

?

JSON 文件

?JSON 文件的文件類型是 ".json"

?JSON 文本的 MIME 類型是 "application/json"

?

?

三、JSON使用

把 JSON 文本轉(zhuǎn)換為 JavaScript 對(duì)象

JSON 最常見(jiàn)的用法之一，是從 web 服務(wù)器上讀取 JSON 數(shù)據(jù)（作為文件或作為 HttpRequest），將 JSON 數(shù)據(jù)轉(zhuǎn)換為 JavaScript 對(duì)象，然后在網(wǎng)頁(yè)中使用該數(shù)據(jù)。

?

JSON 實(shí)例 - 來(lái)自字符串的對(duì)象

?創(chuàng)建包含 JSON 語(yǔ)法的 JavaScript 字符：

Js代碼 ?

var?txt?=?'{"employees":['?+ ??

????'{"firstName":"Bill","lastName":"Gates"?},'?+ ??

????'{"firstName":"George","lastName":"Bush"?},'?+ ??

????'{"firstName":"Thomas","lastName":"Carter"?}]}'; ??

???? ??

var?obj?=?eval?("("?+?txt?+?")"); ??

???? ??

document.getElementById("fname").innerHTML?=?obj.employees[1].firstName; ??

document.getElementById("lname").innerHTML?=?obj.employees[1].lastName;??

var txt = '{"employees":[' +'{"firstName":"Bill","lastName":"Gates" },' +'{"firstName":"George","lastName":"Bush" },' +'{"firstName":"Thomas","lastName":"Carter" }]}';var obj = eval ("(" + txt + ")");document.getElementById("fname").innerHTML = obj.employees[1].firstName; document.getElementById("lname").innerHTML = obj.employees[1].lastName;

?由于 JSON 語(yǔ)法是 JavaScript 語(yǔ)法的子集，JavaScript 函數(shù) eval() 可用于將 JSON 文本轉(zhuǎn)換為 JavaScript 對(duì)象。

eval() 函數(shù)使用的是 JavaScript 編譯器，可解析 JSON 文本，然后生成 JavaScript 對(duì)象。必須把文本包圍在括號(hào)中，這樣才能避免語(yǔ)法錯(cuò)誤：

Js代碼 ?

var?obj?=?eval?("("?+?txt?+?")");??

var obj = eval ("(" + txt + ")");

?在網(wǎng)頁(yè)中使用 JavaScript 對(duì)象：

例子：

Html代碼 ?

<p>??

????????First?Name:?<span?id="fname"></span><br?/>? ??

????Last?Name:?<span?id="lname"></span><br?/>? ??

</p>? ??

<script?type="text/javascript">??

????var?txt?=?'{"employees":['?+ ??

????????'{"firstName":"Bill","lastName":"Gates"?},'?+ ??

????????'{"firstName":"George","lastName":"Bush"?},'?+ ??

????????'{"firstName":"Thomas","lastName":"Carter"?}]}'; ??

???? ??

????var?obj?=?eval?("("?+?txt?+?")"); ??

???? ??

????document.getElementById("fname").innerHTML?=?obj.employees[1].firstName; ??

????document.getElementById("lname").innerHTML?=?obj.employees[1].lastName; ??

</script>??

<p>First Name: <span id="fname"></span><br /> Last Name: <span id="lname"></span><br /> </p> <script type="text/javascript">var txt = '{"employees":[' +'{"firstName":"Bill","lastName":"Gates" },' +'{"firstName":"George","lastName":"Bush" },' +'{"firstName":"Thomas","lastName":"Carter" }]}';var obj = eval ("(" + txt + ")");document.getElementById("fname").innerHTML = obj.employees[1].firstName;document.getElementById("lname").innerHTML = obj.employees[1].lastName; </script>

?

JSON 解析器

提示：eval() 函數(shù)可編譯并執(zhí)行任何 JavaScript 代碼。這隱藏了一個(gè)潛在的安全問(wèn)題。

使用 JSON 解析器將 JSON 轉(zhuǎn)換為 JavaScript 對(duì)象是更安全的做法。JSON 解析器只能識(shí)別 JSON 文本，而不會(huì)編譯腳本。

在瀏覽器中，這提供了原生的 JSON 支持，而且 JSON 解析器的速度更快。

較新的瀏覽器和最新的 ECMAScript (JavaScript) 標(biāo)準(zhǔn)中均包含了原生的對(duì) JSON 的支持。

Web 瀏覽器支持	Web 軟件支持
?Firefox (Mozilla) 3.5 ?Internet Explorer 8 ?Chrome ?Opera 10 ?Safari 4	???jQuery ?Yahoo UI ?Prototype ?Dojo ?ECMAScript 1.5

轉(zhuǎn)載于:https://www.cnblogs.com/gc2013/p/3470219.html

總結(jié)

以上是生活随笔為你收集整理的一些非常实用的JSON 教程的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。