JSON學習

時間 2019-11-30

原文原文鏈接

轉自：http://www.w3school.com.cn/json/index.aspjavascript

JSON:JavaScrip Object Notation(JavaScript對象表示法) php

JSON 是存儲和交換文本信息的語法。相似 XML，但 JSON 比 XML 更小、更快，更易解析。html

如下是JSON的使用示例：java

<html>
<body>
<h2>在 JavaScript 中建立 JSON 對象</h2>

<p>
Name: <span id="jname"></span><br />
Age: <span id="jage"></span><br />
Address: <span id="jstreet"></span><br />
Phone: <span id="jphone"></span><br />
</p>

<script type="text/javascript">
var JSONObject= {
"name":"Bill Gates",
"street":"Fifth Avenue New York 666",
"age":56,
"phone":"555 1234567"};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jstreet").innerHTML=JSONObject.street
document.getElementById("jphone").innerHTML=JSONObject.phone
</script>

</body>
</html>

JSON 語法規則

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

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

JSON 名稱/值對

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

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

"firstName" : "John"

這很容易理解，等價於這條 JavaScript 語句：json

firstName = "John"

JSON 值

JSON 值能夠是：數組

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

JSON 對象

JSON 對象在花括號中書寫：瀏覽器

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

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

這一點也容易理解，與這條 JavaScript 語句等價：

firstName = "John"
lastName = "Doe"

JSON 數組

JSON 數組在方括號中書寫：

數組可包含多個對象：

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

JSON 使用 JavaScript 語法

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

經過 JavaScript，您能夠建立一個對象數組，並像這樣進行賦值：

例子

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

能夠像這樣訪問 JavaScript 對象數組中的第一項：

employees[0].lastName;

返回的內容是：

Gates

能夠像這樣修改數據：

employees[0].lastName;

JSON 文件

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

把 JSON 文本轉換爲 JavaScript 對象

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

爲了更簡單地爲您講解，咱們使用字符串做爲輸入進行演示（而不是文件）。

JSON 實例 - 來自字符串的對象

建立包含 JSON 語法的 JavaScript 字符串：

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

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

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

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

在網頁中使用 JavaScript 對象：

例子

<p>
First Name: <span id="fname"></span><br />
Last Name: <span id="lname"></span><br />
</p>

<script type="text/javascript">
document.getElementById("fname").innerHTML = obj.employees[1].firstName
document.getElementById("lname").innerHTML = obj.employees[1].lastName
</script>