JSON學習筆記（三、使用）

​

常用場景

JSON經常應用到的場景是：在背景應用程式中将響應資料封裝成JSON格式，傳到前台頁面之後，需要将JSON格式轉換為JavaScript對象，然後在網頁中使用該資料。

字元串轉化為json對象

這是一個json格式的字元串，當然實際應用場景中背景傳來的json是作為檔案或作為 HttpRequest

var txt = '{ "sites" : [' +
'{ "name":"baidu" , "url":"www.baidu.com" },' +
'{ "name":"google" , "url":"www.google.com" },' +
'{ "name":"微網誌" , "url":"www.weibo.com" } ]}';      

由于 JSON 文法是 JavaScript 文法的子集，JavaScript 函數 eval() 可用于将 JSON 文本轉換為 JavaScript 對象。

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

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

在網頁中使用json對象：

var txt = '{ "sites" : [' +
'{ "name":"百度" , "url":"www.baidu.com" },' +
'{ "name":"google" , "url":"www.google.com" },' +
'{ "name":"微網誌" , "url":"www.weibo.com" } ]}';
 
var obj = eval ("(" + txt + ")");
 
document.getElementById("name").innerHTML=obj.sites[0].name 
document.getElementById("url").innerHTML=obj.sites[0].url      

JSON轉化為字元串

json是js對象，直接列印的話裡面是看不到東西的，是以要把它轉化成字元串，直接用JSON.stringify 函數就行了。

var urlJson = {"name":"百度","url":"www.baidu.com"};
var urlString = JSON.stringify(hero)
document.write("這是一個json 字元串："+ urlString );      

周遊在很多場景都用得到。

JSON對象周遊

可以使用 for-in 來循環對象的屬性：

var site={"name":"百度","url":"www.baidu.com"};
for (x in site) {
    document.getElementById("demo").innerHTML += x + "<br>";
}      

JSON數組周遊

for-in

var json = [
    {"name":"第1條"},
    {"name":"第2條"},
    {"name":"第3條"}
]
for( i in json){
    alert(json[i].name);
}      

for 循環

var json = [
    {"name":"第1條"},
    {"name":"第2條"},
    {"name":"第3條"}
]
for( i=0;i<json.length;i++){
    alert(json[i].name);
}