JSON

JSON：JavaScript 對象表示法（JavaScript Object Notation）。

JSON 是存儲和交換文本信息的語法。

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

什麼是 JSON ？

• JSON 指的是 JavaScript 對象表示法（JavaScript Object Notation）
• JSON 是輕量級的文本數據交換格式
• JSON 獨立於語言：JSON 使用 Javascript語法來描述數據對象，可是 JSON 仍然獨立於語言和平臺。JSON 解析器和 JSON 庫支持許多不一樣的編程語言。 目前很是多的動態（PHP，JSP，.NET）編程語言都支持JSON。
• JSON 具備自我描述性，更易理解

JSON - 轉換爲 JavaScript 對象

JSON 文本格式在語法上與建立 JavaScript 對象的代碼相同。

因爲這種類似性，無需解析器，JavaScript 程序可以使用內建的 eval() 函數，用 JSON 數據來生成原生的 JavaScript 對象。

與 XML 相同之處

• JSON 是純文本
• JSON 具備"自我描述性"（人類可讀）
• JSON 具備層級結構（值中存在值）
• JSON 可經過 JavaScript 進行解析
• JSON 數據可以使用 AJAX 進行傳輸

與 XML 不一樣之處

• 沒有結束標籤
• 更短
• 讀寫的速度更快
• 可以使用內建的 JavaScript eval() 方法進行解析
• 使用數組
• 不使用保留字

爲何使用 JSON？

對於 AJAX 應用程序來講，JSON 比 XML 更快更易使用：

使用 XML

• 讀取 XML 文檔
• 使用 XML DOM 來循環遍歷文檔
• 讀取值並存儲在變量中

使用 JSON

• 讀取 JSON 字符串
• 用 eval() 處理 JSON 字符串

JSON 語法

JSON 語法是 JavaScript 語法的子集。

JSON 語法規則

JSON 語法是 JavaScript 對象表示語法的子集。

• 數據在名稱/值對中
• 數據由逗號分隔
• 大括號保存對象
• 中括號保存數組

JSON 名稱/值對

JSON 數據的書寫格式是：名稱/值對。

名稱/值對包括字段名稱（在雙引號中），後面寫一個冒號，而後是值：

"name" : "菜鳥教程"

等價於JavaScript 語句：

name = "菜鳥教程"

JSON 值

JSON 值能夠是：

• 數字（整數或浮點數）
• 字符串（在雙引號中）
• 邏輯值（true 或 false）
• 數組（在中括號中）
• 對象（在大括號中）
• null

JSON 數字

JSON 數字能夠是整型或者浮點型：

{ "age":30 }

JSON 對象

JSON 對象在大括號（{}）中書寫：

對象能夠包含多個名稱/值對：

{ "name":"菜鳥教程" , "url":"www.runoob.com" }

等價於JavaScript 語句：

name = "菜鳥教程"

url = "www.runoob.com"

JSON 數組

JSON 數組在中括號中書寫：

數組可包含多個對象：

{

"sites": [

{ "name":"菜鳥教程" , "url":"www.runoob.com" },

{ "name":"google" , "url":"www.google.com" },

{ "name":"微博" , "url":"www.weibo.com" }

]

}

對象 "sites" 是包含三個對象的數組。每一個對象表明一條關於某個網站（name、url）的記錄。

JSON 布爾值

JSON 布爾值能夠是 true 或者 false：

{ "flag":true }

JSON null

JSON 能夠設置 null 值：

{ "runoob":null }

JSON 使用 JavaScript 語法

由於 JSON 使用 JavaScript 語法，因此無需額外的軟件就能處理 JavaScript 中的 JSON。

JSON 文件

• JSON 文件的文件類型是 ".json"
• JSON 文本的 MIME 類型是 "application/json"

JSON 對象

{ "name":"runoob", "alexa":10000, "site":null }

JSON 對象使用在大括號({})中書寫。

對象能夠包含多個 key/value（鍵/值）對。

key 必須是字符串，value 能夠是合法的 JSON 數據類型（字符串, 數字, 對象, 數組, 布爾值或 null）。

key 和 value 中使用冒號(:)分割。

每一個 key/value 對使用逗號(,)分割。

訪問對象值

你可使用點號（.）來訪問對象的值：

var myObj, x;

myObj = { "name":"runoob", "alexa":10000, "site":null };

x = myObj.name;

你也可使用中括號（[]）來訪問對象的值：

var myObj, x;

myObj = { "name":"runoob", "alexa":10000, "site":null };

x = myObj["name"];

循環對象

你可使用 for-in 來循環對象的屬性：

var myObj = { "name":"runoob", "alexa":10000, "site":null };

for (x in myObj) {

    document.getElementById("demo").innerHTML += x + "<br>";

}

在 for-in 循環對象的屬性時，使用中括號（[]）來訪問屬性的值：

var myObj = { "name":"runoob", "alexa":10000, "site":null };

for (x in myObj) {

    document.getElementById("demo").innerHTML += myObj[x] + "<br>";

}

嵌套 JSON 對象

JSON 對象中能夠包含另一個 JSON 對象：

你可使用點號(.)或者中括號([])來訪問嵌套的 JSON 對象。

修改值

你可使用點號(.)來修改 JSON 對象的值：

你可使用中括號([])來修改 JSON 對象的值：

刪除對象屬性

咱們可使用 delete 關鍵字來刪除 JSON 對象的屬性：

delete myObj.sites.site1;

你可使用中括號([])來刪除 JSON 對象的屬性：

JSON 數組

數組做爲 JSON 對象

JSON 數組在中括號中書寫。

JSON 中數組值必須是合法的 JSON 數據類型（字符串, 數字, 對象, 數組, 布爾值或 null）。

JavaScript 中，數組值能夠是以上的 JSON 數據類型，也能夠是 JavaScript 的表達式，包括函數，日期，及 undefined。

JSON 對象中的數組

對象屬性的值能夠是一個數組：

咱們可使用索引值來訪問數組：

x = myObj.sites[0];

循環數組

你可使用 for-in 來訪問數組：

你也可使用 for 循環：

嵌套 JSON 對象中的數組

JSON 對象中數組能夠包含另一個數組，或者另一個 JSON 對象：

咱們可使用 for-in 來循環訪問每一個數組：

修改數組值

你可使用索引值來修改數組值：

刪除數組元素

咱們可使用 delete 關鍵字來刪除數組元素：

JSON.parse()

JSON 一般用於與服務端交換數據。

在接收服務器數據時通常是字符串。

咱們可使用 JSON.parse() 方法將數據轉換爲 JavaScript 對象。

JSON.parse(text[, reviver])

參數說明：

• text:必需， 一個有效的 JSON 字符串。
• reviver: 可選，一個轉換結果的函數， 將爲對象的每一個成員調用此函數。

JSON 解析實例

解析前要確保你的數據是標準的 JSON 格式，不然會解析出錯。

從服務端接收 JSON 數據

咱們可使用 AJAX 從服務器請求 JSON 數據，並解析爲 JavaScript 對象。

從服務端接收數組的 JSON 數據

若是從服務端接收的是數組的 JSON 數據，則 JSON.parse 會將其轉換爲 JavaScript 數組：

異常

解析數據

JSON 不能存儲 Date 對象。

若是你須要存儲 Date 對象，須要將其轉換爲字符串。

以後再將字符串轉換爲 Date 對象。

咱們能夠啓用 JSON.parse 的第二個參數 reviver，一個轉換結果的函數，對象的每一個成員調用此函數。

解析函數

JSON 不容許包含函數，但你能夠將函數做爲字符串存儲，以後再將字符串轉換爲函數。

JSON.stringify()

JSON 一般用於與服務端交換數據。

在向服務器發送數據時通常是字符串。

咱們可使用 JSON.stringify() 方法將 JavaScript 對象轉換爲字符串。

JSON.stringify(value[, replacer[, space]])

參數說明：

value:

必需， 一個有效的 JSON 對象。

replacer:

可選。用於轉換結果的函數或數組。

若是 replacer 爲函數，則 JSON.stringify 將調用該函數，並傳入每一個成員的鍵和值。使用返回值而不是原始值。若是此函數返回 undefined，則排除成員。根對象的鍵是一個空字符串：""。

若是 replacer 是一個數組，則僅轉換該數組中具備鍵值的成員。成員的轉換順序與鍵在數組中的順序同樣。當 value 參數也爲數組時，將忽略 replacer 數組。

space:

可選，文本添加縮進、空格和換行符，若是 space 是一個數字，則返回值文本在每一個級別縮進指定數目的空格，若是 space 大於 10，則文本縮進 10 個空格。space 有可使用非數字，如：\t。

JavaScript 數組轉換

咱們也能夠將 JavaScript 數組轉換爲 JSON 字符串：

異常

解析數據

JSON 不能存儲 Date 對象。

JSON.stringify() 會將全部日期轉換爲字符串。

以後你能夠再將字符串轉換爲 Date 對象。

解析函數

JSON 不容許包含函數，JSON.stringify() 會刪除 JavaScript 對象的函數，包括 key 和 value。

咱們能夠在執行 JSON.stringify() 函數前將函數轉換爲字符串來避免以上問題的發生：

不建議在 JSON 中使用函數。

JSON 使用

把 JSON 文本轉換爲 JavaScript 對象

JSON 最多見的用法之一，是從 web 服務器上讀取 JSON 數據（做爲文件或做爲 HttpRequest），將 JSON 數據轉換爲 JavaScript 對象，而後在網頁中使用該數據。

因爲 JSON 語法是 JavaScript 語法的子集，JavaScript 函數 eval() 可用於將 JSON 文本轉換爲 JavaScript 對象。

eval() 函數使用的是 JavaScript 編譯器，可解析 JSON 文本，而後生成 JavaScript 對象。必須把文本包圍在括號中，這樣才能避免語法錯誤：

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

JSON 解析器

eval() 函數可編譯並執行任何 JavaScript 代碼。這隱藏了一個潛在的安全問題。

使用 JSON 解析器將 JSON 轉換爲 JavaScript 對象是更安全的作法。JSON 解析器只能識別 JSON 文本，而不會編譯腳本。

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

較新的瀏覽器和最新的 ECMAScript (JavaScript) 標準中均包含了原生的對 JSON 的支持。

JSONP 教程

Jsonp(JSON with Padding) 是 json 的一種"使用模式"，可讓網頁從別的域名（網站）那獲取資料，即跨域讀取數據。

爲何咱們從不一樣的域（網站）訪問數據須要一個特殊的技術(JSONP )呢？這是由於同源策略。

同源策略，它是由Netscape提出的一個著名的安全策略，如今全部支持JavaScript 的瀏覽器都會使用這個策略。

JSONP 應用

1. 服務端JSONP格式數據

2. 客戶端實現 callbackFunction 函數