JavaScript

JS JSON

• JSON 英文全称 JavaScript Object Notation
• JSON 是一种轻量级的数据交换格式，用于存储和传输数据
• JSON 是独立的语言，通常用于服务端向网页传递数据
• JSON 使用 JS 语法，但是 JSON 格式仅仅是一个文本，文本可以被任何编程语言读取作为数据格式传递

JSON 实例

• 以下 JSON 语法定义了 sites 对象：3条网站信息（对象）的数组

{
    "sites":[
        {"name":"Baidu","url":"www.baidu.com"},
        {"name":"Google","url":"www.google.com"},
        {"name":"Taobao","url":"www.taobao.com"}
    ]
}

• JSON 格式化后为 JS 对象
• JSON 格式在语法上与创建 JS 对象代码是相同的
• 由于它们很相似，所以 JS 程序可以很容易的将 JSON 数据转换为 JS对象

JSON 语法规则

• 数据为 键/值 对
• 数据由逗号分隔
• 大括号保存对象
• 方括号保存数组

JSON 数据

• 一个名称对应一个值（键/值对，就像 JS 对象属性）

"name":"Baidu"

JSON 对象

• JSON 对象保存在大括号内
• 对象可以保存多个 键/值 对

{"name":"Baidu","url":"www.baidu.com"}

JSON 数组

• JSON 数组保存在中括号内
• JSON 数组可以包含对象

"sites":[
    {"name":"Baidu","url":"www.baidu.com"},
    {"name":"Google","url":"www.google.com"},
    {"name":"Taobao","url":"www.taobao.com"}
]

JSON 字符串转换为 JS 对象

• 通常我们从服务器读取 JSON 数据，并在网页中显示数据
• 简单起见，我们直接在网页中设置 JSON 字符串
• 首先，创建 JS 字符串，字符串为 JSON格式的数据

var text ='{
	"sites":[
        {"name":"Baidu","url":"www.baidu.com"},
        {"name":"Google","url":"www.google.com"},
        {"name":"Taobao","url":"www.taobao.com"}
    ]
}';

• 然后，我们用 JS 内置函数 JSON.parse() 将字符串转换为 JS 对象

var obj = JSON.parse(text);

• 最后，在页面中使用新的 JS 对象

document.getElementById("demo").innerHTML = obj.sites[1].name + " " + obj.sites[1].url;
// 输出 Google www.google.com

相关函数

函数	描述
JSON.parse()	将 JSON 字符串转换为 JS 对象
JSON.stringify()	将 JS 字符串转换为 JSON 对象