在JavaScript中使用JSON數(shù)據(jù)
JSON 是 JavaScript 原生格式,這意味著 在 JavaScript 中處理 JSON 數(shù)據(jù)不需要任何特殊的 API 或工具包。
JSON語法
JSON建構(gòu)于兩種結(jié)構(gòu):
對象——名稱/值對的集合。不同的語言中,它被理解為對象,紀(jì)錄,結(jié)構(gòu),字典,哈希表,有鍵列表(keyed list),或者關(guān)聯(lián)數(shù)組。一個對象以“{”(左括號)開始,“}”(右括號)結(jié)束。每個“名稱”后跟一個“:”(冒號);“‘名稱/值' 對”之間使用“,”(逗號)分隔。
數(shù)組——值的有序列表。在大部分語言中,它被理解為數(shù)組。一個數(shù)組以“[”(左中括號)開始,“]”(右中括號)結(jié)束。值之間使用“,”(逗號)分隔。
JSON沒有變量或其他控制結(jié)構(gòu)。JSON只用于數(shù)據(jù)傳輸。
將JSON 數(shù)據(jù)賦值給變量
例如,可以創(chuàng)建一個新的 JavaScript 變量,然后將 JSON 格式的數(shù)據(jù)字符串直接賦值給它:
var people =
{ "programmers": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }
],
"authors": [
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
],
"musicians": [
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
]
}
這非常簡單;現(xiàn)在 people 包含前面看到的 JSON 格式的數(shù)據(jù)。但是,這還不夠,因?yàn)樵L問數(shù)據(jù)的方式似乎還不明顯。
訪問數(shù)據(jù)
盡管看起來不明顯,但是上面的長字符串實(shí)際上只是一個數(shù)組;將這個數(shù)組放進(jìn) JavaScript 變量之后,就可以很輕松地訪問它。實(shí)際上,只需用點(diǎn)號表示法來表示數(shù)組元素。所以,要想訪問 programmers 列表的第一個條目的姓氏,只需在 JavaScript 中使用下面這樣的代碼:
people.programmers[0].lastName;
注意,數(shù)組索引是從零開始的。所以,這行代碼首先訪問 people 變量中的數(shù)據(jù);然后移動到稱為 programmers 的條目,再移動到第一個記錄( [0] );最后,訪問 lastName 鍵的值。結(jié)果是字符串值 “McLaughlin” 。
下面是使用同一變量的幾個示例。
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 格式的數(shù)據(jù),而不需要使用任何額外的 JavaScript 工具包或 API 。
修改 JSON 數(shù)據(jù)
正如可以用點(diǎn)號和括號訪問數(shù)據(jù),也可以按照同樣的方式輕松地修改數(shù)據(jù):
people.musicians[1].lastName = "Rachmaninov";
在將字符串轉(zhuǎn)換為 JavaScript json 格式對象之后,就可以像這樣修改變量中的數(shù)據(jù)。
注意:json 格式的對象和 json 文本是不同的
var obj={name:" 張三 ","sex":' 男 '}; //json 格式的對象
var str=" { name: " 張三 " , "sex" : ' 男 ' }" ; //json 格式的字符串( json 格式的文本)
轉(zhuǎn)換回字符串
當(dāng)然,如果不能輕松地將對象轉(zhuǎn)換回本文提到的文本格式,那么所有數(shù)據(jù)修改都沒有太大的價(jià)值。在 JavaScript 中這種轉(zhuǎn)換也很簡單:
var newJSONtext = people.toJSONString();
這樣就行了!現(xiàn)在就獲得了一個可以在任何地方使用的文本字符串,例如,可以將它用作 Ajax 應(yīng)用程序中的請求字符串。
更重要的是,可以將任何 JavaScript 對象轉(zhuǎn)換為 JSON 文本。并非只能處理原來用 JSON 字符串賦值的變量。為了對名為 myObject 的對象進(jìn)行轉(zhuǎn)換,只需執(zhí)行相同形式的命令:
<script type="text/javascript">
function Car(make,model,year,color)
{
this.make=make;
this.model=model;
this.year=year;
this.color=color;
}
function showCar()
{
var carr = new Car("Dodge","Coronet R/T",1968,"yellow");
alert(carr.toJSONString());
}
</script>
這就是 JSON 與其他數(shù)據(jù)格式之間最大的差異。如果使用 JSON ,只需調(diào)用一個簡單的函數(shù),就可以獲得經(jīng)過格式化的數(shù)據(jù),可以直接使用了。對于其他數(shù)據(jù)格式,需要在原始數(shù)據(jù)和格式化數(shù)據(jù)之間進(jìn)行轉(zhuǎn)換。即使使用 Document Object Model 這樣的 API (提供了將自己的數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)換為文本的函數(shù)),也需要學(xué)習(xí)這個 API 并使用 API 的對象,而不是使用原生的 JavaScript 對象和語法。
最終結(jié)論是,如果要處理大量 JavaScript 對象,那么 JSON 幾乎肯定是一個好選擇,這樣就可以輕松地將數(shù)據(jù)轉(zhuǎn)換為可以在請求中發(fā)送給服務(wù)器端程序的格式(Ajax) 。
JSON字符串轉(zhuǎn)換為JSON對象的方法
要使用上面的str1,必須使用下面的方法先轉(zhuǎn)化為JSON對象:
//由JSON字符串轉(zhuǎn)換為JSON對象
var obj = eval('(' + str + ')');
或者
var obj = str.parseJSON(); //由JSON字符串轉(zhuǎn)換為JSON對象
或者
var obj = JSON.parse(str); //由JSON字符串轉(zhuǎn)換為JSON對象
然后,就可以這樣讀?。?/p>
Alert(obj.name); Alert(obj.sex);
特別注意:如果obj本來就是一個JSON對象,那么使用eval()函數(shù)轉(zhuǎn)換后(哪怕是多次轉(zhuǎn)換)還是JSON對象,但是使用parseJSON()函數(shù)處理后會有問題(拋出語法異常)。
- js使用eval解析json實(shí)例與注意事項(xiàng)分享
- java對象序列化與反序列化的默認(rèn)格式和json格式使用示例
- jquery序列化form表單使用ajax提交后處理返回的json數(shù)據(jù)
- JSON中雙引號的輪回使用過程中一定要小心
- 教你如何使用PHP輸出中文JSON字符串
- JSON.parse()和JSON.stringify()使用介紹
- 直接在JS里創(chuàng)建JSON數(shù)據(jù)然后遍歷使用
- PHP中使用json數(shù)據(jù)格式定義字面量對象的方法
- 使用JSON.parse將json字符串轉(zhuǎn)換成json對象的時(shí)候會出錯
- Android中生成、使用Json數(shù)據(jù)實(shí)例
- PHP使用json_encode函數(shù)時(shí)不轉(zhuǎn)義中文的解決方法
- ASP.NET中MVC使用AJAX調(diào)用JsonResult方法并返回自定義錯誤信息
相關(guān)文章
使用webpack3.0配置webpack-dev-server教程
這篇文章主要介紹了使用webpack3.0配置webpack-dev-server教程,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
js實(shí)現(xiàn)圖片推拉門效果代碼實(shí)例
這篇文章主要介紹了js實(shí)現(xiàn)圖片推拉門效果代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
Javascript獲取當(dāng)前日期的農(nóng)歷日期代碼
這篇文章主要介紹了利用Javascript獲取當(dāng)前日期的農(nóng)歷日期代碼,很實(shí)用,需要的朋友可以參考下2014-10-10

