JSON概念性知識

JSON：JavaScript 物件表示法（JavaScript Object Notation）

JSON 是儲存和交換文字資訊的語法，類似 XML。其採用鍵值對的方式來組織，不僅易於閱讀和編寫，且易於機器解析和生成。

JSON 是獨立於語言的，也就是說不管什麼語言，都可以解析json，只需要按照其規則來就行。

JSON & XML相比：

json的長度和xml格式比起來小很多，減少開啟頁面的頻寬
json讀寫的速度更快
json可以使用 JavaScript內建的方法直接進行解析並轉換稱JavaScript物件，非常方便

JSON的語法規則：

JSON 資料的書寫格式：名稱/值對。

名稱/值對組合中的名稱寫在前面（在雙引號中），值對寫在後面（同樣需新增雙引號），中間用冒號隔開。
比如："name":"楊康"

JSON的值可以是下面的這些型別：

數字（整數或浮點數），比如123，1.23
字串（在雙引號中）
邏輯值（true 或 false）
陣列（在方括號中）
物件（在花括號中）
null

下面給出一個例子：

{
"staff":[
    {"name":"唐三","age":70},
    {"name":"孫康","age":35},
    {"name":"林重","age":21}
]
}

JSON解析方法：

eval和JSON.parse

在程式碼中使用eval是很危險的！特別是在執行第三方的JSON資料（其中可能包含惡意程式碼）時，儘可能使用JSON.parse()方法解析字串本身，該方法還可以捕捉JSON中的語法錯誤。

在瀏覽器工具-Console中嘗試：

測試eval：

var jsondata= '{"staff":[{"name":"唐三","age":70},{"name":"孫康","age":35},{"name":"林重","age":21}]}';
var jsonobj = eval('('+jsondata+')');
alert("姓名："+ jsonobj.staff[0].name +"； 年齡："+ jsonobj.staff[0].age);

測試json.parse：

var jsondata= '{"staff":[{"name":"唐三","age":70},{"name":"孫康","age":35},{"name":"林重","age":21}]}';
var jsonobj = JSON.parse(jsondata);
alert("姓名："+ jsonobj.staff[0].name +"； 年齡："+ jsonobj.staff[0].age);

測試eval在解析的同時還會執行字串中的方法：

下面程式碼中會先彈出數字“123”，然後再彈出解析出來的姓名和年齡。

var jsondata= '{"staff":[{"name":"唐三","age":alert(123)},{"name":"孫康","age":35},{"name":"林重","age":21}]}';
var jsonobj = eval('('+jsondata+')');
alert("姓名："+ jsonobj.staff[0].name +"； 年齡："+ jsonobj.staff[0].age);

測試JSON.parse在解析時候發現其中有其他方法的時候會直接顯示語法錯誤並不繼續執行後續方法：

var jsondata= '{"staff":[{"name":"唐三","age":alert(123)},{"name":"孫康","age":35},{"name":"林重","age":21}]}';
var jsonobj = JSON.parse(jsondata);
alert("姓名："+ jsonobj.staff[0].name +"； 年齡："+ jsonobj.staff[0].age);

JSON線上校驗工具：http://jsonlint.com

將前面出現的staff字串貼上到其中的框框中，點選Validate按鈕即可校驗。