JSON學習

轉載廖大的教程

JSON是JavaScript Object Notation的縮寫,它是一種數據交換格式。

在JSON出現之前,大家一直用XML來傳遞數據。因爲XML是一種純文本格式,所以它適合在網絡上交換數據。XML本身不算複雜,但是,加上DTD、XSD、XPath、XSLT等一大堆複雜的規範以後,任何正常的軟件開發人員碰到XML都會感覺頭大了,最後大家發現,即使你努力鑽研幾個月,也未必搞得清楚XML的規範。

終於,在2002年的一天,道格拉斯·克羅克福特(Douglas Crockford)同學爲了拯救深陷水深火熱同時又被某幾個巨型軟件企業長期愚弄的軟件工程師,發明了JSON這種超輕量級的數據交換格式。

道格拉斯同學長期擔任雅虎的高級架構師,自然鍾情於JavaScript。他設計的JSON實際上是JavaScript的一個子集。在JSON中,一共就這麼幾種數據類型:

number:和JavaScript的number完全一致;
boolean:就是JavaScript的true或false;
string:就是JavaScript的string;
null:就是JavaScript的null;
array:就是JavaScript的Array表示方式——[];
object:就是JavaScript的{ … }表示方式。
以及上面的任意組合。

並且,JSON還定死了字符集必須是UTF-8,表示多語言就沒有問題了。爲了統一解析,JSON的字符串規定必須用雙引號"",Object的鍵也必須用雙引號""。

由於JSON非常簡單,很快就風靡Web世界,並且成爲ECMA標準。幾乎所有編程語言都有解析JSON的庫,而在JavaScript中,我們可以直接使用JSON,因爲JavaScript內置了JSON的解析。

把任何JavaScript對象變成JSON,就是把這個對象序列化成一個JSON格式的字符串,這樣才能夠通過網絡傳遞給其他計算機。

如果我們收到一個JSON格式的字符串,只需要把它反序列化成一個JavaScript對象,就可以在JavaScript中直接使用這個對象了。

序列化

讓我們先把小明這個對象序列化成JSON格式的字符串:

‘use strict’;

var xiaoming = {
name: ‘小明’,
age: 14,
gender: true,
height: 1.65,
grade: null,
‘middle-school’: ‘“W3C” Middle School’,
skills: [‘JavaScript’, ‘Java’, ‘Python’, ‘Lisp’]
};
Run
要輸出得好看一些,可以加上參數,按縮進輸出:

JSON.stringify(xiaoming, null, ’ ');
結果:

{
“name”: “小明”,
“age”: 14,
“gender”: true,
“height”: 1.65,
“grade”: null,
“middle-school”: ““W3C” Middle School”,
“skills”: [
“JavaScript”,
“Java”,
“Python”,
“Lisp”
]
}
第二個參數用於控制如何篩選對象的鍵值,如果我們只想輸出指定的屬性,可以傳入Array:

JSON.stringify(xiaoming, [‘name’, ‘skills’], ’ ');
結果:

{
“name”: “小明”,
“skills”: [
“JavaScript”,
“Java”,
“Python”,
“Lisp”
]
}
還可以傳入一個函數,這樣對象的每個鍵值對都會被函數先處理:

function convert(key, value) {
if (typeof value === ‘string’) {
return value.toUpperCase();
}
return value;
}

JSON.stringify(xiaoming, convert, ’ ');
上面的代碼把所有屬性值都變成大寫:

{
“name”: “小明”,
“age”: 14,
“gender”: true,
“height”: 1.65,
“grade”: null,
“middle-school”: ““W3C” MIDDLE SCHOOL”,
“skills”: [
“JAVASCRIPT”,
“JAVA”,
“PYTHON”,
“LISP”
]
}
如果我們還想要精確控制如何序列化小明,可以給xiaoming定義一個toJSON()的方法,直接返回JSON應該序列化的數據:

var xiaoming = {
name: ‘小明’,
age: 14,
gender: true,
height: 1.65,
grade: null,
‘middle-school’: ‘“W3C” Middle School’,
skills: [‘JavaScript’, ‘Java’, ‘Python’, ‘Lisp’],
toJSON: function () {
return { // 只輸出name和age,並且改變了key:
‘Name’: this.name,
‘Age’: this.age
};
}
};

JSON.stringify(xiaoming); // ‘{“Name”:“小明”,“Age”:14}’
反序列化

拿到一個JSON格式的字符串,我們直接用JSON.parse()把它變成一個JavaScript對象:

JSON.parse(’[1,2,3,true]’); // [1, 2, 3, true]
JSON.parse(’{“name”:“小明”,“age”:14}’); // Object {name: ‘小明’, age: 14}
JSON.parse(‘true’); // true
JSON.parse(‘123.45’); // 123.45
JSON.parse()還可以接收一個函數,用來轉換解析出的屬性:

‘use strict’;
Run
在JavaScript中使用JSON,就是這麼簡單!

練習

用瀏覽器訪問Yahoo的天氣API,查看返回的JSON數據,然後返回城市、氣溫預報等信息:

‘use strict’

var url = ‘https://query.yahooapis.com/v1/public/yql?q=select * from weather.forecast where woeid %3D 2151330&format=json’;
// 從遠程地址獲取JSON:
$.getJSON(url, function (data) {

});
Run

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章