JavaScript JSON

JSON 是存儲和傳輸數據的格式。

JSON 經常在數據從服務器發送到網頁時使用。

什么是 JSON？

  • JSON 指的是 JavaScript Object Notation
  • JSON 是輕量級的數據交換格式
  • JSON 獨立于語言 *
  • JSON 是“自描述的”且易于理解

* JSON 的語法是來自 JavaScript 對象符號的語法，但 JSON 格式是純文本。讀取和生成 JSON 數據的代碼可以在任何編程語言編寫的。

JSON 實例

JSON 語法定義了一個雇員對象：包含三條員工記錄的數組（對象）：

JSON 實例

{
"employees":[
    {"firstName":"Bill", "lastName":"Gates"}, 
    {"firstName":"Steve", "lastName":"Jobs"},
    {"firstName":"Alan", "lastName":"Turing"}
]
}

JSON 格式評估為 JavaScript 對象

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

由于這種相似性，JavaScript 程序可以很容易地將 JSON 數據轉換成本地的 JavaScript 對象。

JSON 語法規則

  • 數據是名稱/值對
  • 數據由逗號分隔
  • 花括號保存對象
  • 方括號保存數組

JSON 數據 - 名稱和值

JSON 數據的書寫方式是名稱/值對，類似 JavaScript 對象屬性。

名稱/值對由（雙引號中的）字段名構成，其后是冒號，再其后是值：

"firstName":"Bill"

JSON 名稱需要雙引號。JavaScript 名稱不需要。

JSON 對象

JSON 對象是在花括號內書寫的。

類似 JavaScript，對象能夠包含多個名稱/值對：

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

JSON 數組

JSON 數組在方括號中書寫。

類似 JavaScript，數組能夠包含對象：

"employees":[
    {"firstName":"Bill", "lastName":"Gates"}, 
    {"firstName":"Steve", "lastName":"Jobs"}, 
    {"firstName":"Alan", "lastName":"Turing"}
]

在上面的例子中，對象 "employees" 是一個數組。它包含了三個對象。

每個對象代表一個人的一條記錄（帶有名和姓）。

把 JSON 文本轉換為 JavaScript 對象

JSON 的通常用法是從 web 服務器讀取數據，然后在網頁中顯示數據。

為了簡單起見，可以使用字符串作為輸入演示。

首先，創建包含 JSON 語法的 JavaScript 字符串：

var text = '{ "employees" : [' +
'{ "firstName":"Bill" , "lastName":"Gates" },' +
'{ "firstName":"Steve" , "lastName":"Jobs" },' +
'{ "firstName":"Alan" , "lastName":"Turing" } ]}';

然后，使用 JavaScript 的內建函數 JSON.parse() 來把這個字符串轉換為 JavaScript 對象：

var obj = JSON.parse(text);

最后，請在您的頁面中使用這個新的 JavaScript 對象：

實例

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;
</script>

親自試一試

您可以在我們的 JSON 教程 中閱讀更多有關 JSON 的內容。