JSON详解

本文详细阐述了JSON数据格式及其如何与JavaScript对象进行转换和交互。解释了JSON字符串与JS对象的区别,并提供了实例说明如何读取、修改及转换JSON数据。

首先在阅读本文之前必须明白几点:

      1、JavaScript操作的是JS对象

      2、JSON对象是JSON对象,而JS对象是JS对象

      3、JavaScript若要使用JSON中的数据,必须将JSON字符串转换为JS对象

      4、在数据的传输过程中,JSON数据是以文本,即字符串格式形式存在(说白了,JSON就是一个字符串)

例如:

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

这个例子中

      JSON对象employees是包含三个对象的数组。每个对象代表一条关于某人(有姓和名)的记录。


上面的这个JSON对象JS并不能操作它,要想操作它得转换为js对象:

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

可以像这样访问 JavaScript 对象数组中的第一项:

employees[0].lastName;

返回的内容是:

Gates

可以像这样修改数据:

employees[0].lastName = "Jobs";

{
     "programmers": [{
         "firstName": "Brett",
         "lastName": "McLaughlin",
         "email": "aaaa"
     }, {
         "firstName": "Jason",
         "lastName": "Hunter",
         "email": "bbbb"
     }, {
         "firstName": "Elliotte",
         "lastName": "Harold",
         "email": "cccc"
     }],
     "authors": [{
         "firstName": "Isaac",
         "lastName": "Asimov",
         "genre": "sciencefiction"
     }, {
         "firstName": "Tad",
         "lastName": "Williams",
         "genre": "fantasy"
     }, {
         "firstName": "Frank",
         "lastName": "Peretti",
         "genre": "christianfiction"
     }],
     "musicians": [{
         "firstName": "Eric",
         "lastName": "Clapton",
         "instrument": "guitar"
     }, {
         "firstName": "Sergei",
         "lastName": "Rachmaninoff",
         "instrument": "piano"
     }]
}
这里最值得注意的是,能够表示多个值,每个值进而包含多个值。但是还应该注意,在不同的主条目(programmers、authors 和 musicians)之间,记录中实际的名称 / 值对可以不一样。JSON 是完全动态的,允许在 JSON 结构的中间改变表示数据的方式。
在处理 JSON 格式的数据时,没有需要遵守的预定义的约束。所以,在同样的数据结构中,可以改变表示数据的方式,甚至可以以不同方式表示同一事物。

格式应用

编辑
掌握了 JSON 格式之后,在 JavaScript 中使用它就很简单了。JSON 是  JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON 数据不需要任何特殊的 API 或工具包。

赋值给变量

例如,可以创建一个新的 JavaScript 变量,然后将 JSON 格式的数据字符串直接赋值给它:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
var people = {
     "programmers": [{
         "firstName": "Brett",
         "lastName": "McLaughlin",
         "email": "aaaa"
     }, {
         "firstName": "Jason",
         "lastName": "Hunter",
         "email": "bbbb"
     }, {
         "firstName": "Elliotte",
         "lastName": "Harold",
         "email": "cccc"
     }],
     "authors": [{
         "firstName": "Isaac",
         "lastName": "Asimov",
         "genre": "sciencefiction"
     }, {
         "firstName": "Tad",
         "lastName": "Williams",
         "genre": "fantasy"
     }, {
         "firstName": "Frank",
         "lastName": "Peretti",
         "genre": "christianfiction"
     }],
     "musicians": [{
         "firstName": "Eric",
         "lastName": "Clapton",
         "instrument": "guitar"
     }, {
         "firstName": "Sergei",
         "lastName": "Rachmaninoff",
         "instrument": "piano"
     }]
};
这非常简单;people包含前面看到的 JSON 格式的数据。但是,这还不够,因为访问数据的方式似乎还不明显。

访问数据

尽管看起来不明显,但是上面的长字符串实际上只是一个 数组;将这个数组放进 JavaScript变量之后,就可以很轻松地访问它。实际上,只需用点号表示法来表示数组元素。所以,要想访问 programmers 列表的第一个条目的姓氏,只需在 JavaScript 中使用下面这样的代码:
1
people.programmers[0].lastName;
注意,数组索引是从零开始的。所以,这行代码首先访问 people变量中的数据;然后移动到称为 programmers的条目,再移动到第一个记录([0]);最后,访问 lastName键的值。结果是字符串值 “McLaughlin”。
下面是使用同一变量的几个示例。
1
2
3
people.authors[1].genre   // Value is "fantasy"
people.musicians[3].lastName  // Undefined. This refers to the fourth entry, and there isn't one
people.programmers[2].firstName  // Value is "Elliotte"
利用这样的语法,可以处理任何 JSON 格式的数据,而不需要使用任何额外的 JavaScript 工具包或 API。

修改数据

正如可以用点号和方括号访问数据,也可以按照同样的方式轻松地修改数据:
1
people.musicians[1].lastName= "Rachmaninov" ;
在将字符串转换为 JavaScript 对象之后,就可以像这样修改变量中的数据。

换回字符串

最终结论是,如果要处理大量 JavaScript 对象,那么 JSON 是一个好选择,这样就可以轻松地将数据转换为可以在请求中发送给服务器端程序的格式。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值