Ajax中數(shù)據(jù)傳遞的另一種模式 javascript Object Notation思想(JSON)
更新時(shí)間:2010年12月09日 18:06:14 作者:
JSON是一個(gè)誘人的技術(shù),準(zhǔn)備做一個(gè)大量的試用。希望屆時(shí)可以獲取大的性能提高。
Ajax是“異步j(luò)avascript和XML”的縮寫已經(jīng)眾所周知,然而雖然XML是看上去的重要組成部分,它卻不是必須的。一位資深的軟件工程師Douglas Crock ford 開發(fā)了一個(gè)內(nèi)建于 javascript 的數(shù)據(jù)格式,稱為javascript 對象表示(JSON,javascript Object Notation),意思是直接使用Ajax對象來傳遞信息,可以讀作“Jason”。
1. 什么是 JSON
JSON概念很簡單,JSON 是一種輕量級的數(shù)據(jù)格式,他基于 javascript 語法的子集,即數(shù)組和對象表示。由于使用的是 javascript 語法,因此JSON 定義可以包含在javascript 文件中,對其的訪問無需通過基于 XML 的語言來額外解析。不過在使用 JSON 之前,很重要的一點(diǎn)是理解 javascript 中數(shù)組及對象字面量的特殊語法。
1.1 數(shù)組字面量
數(shù)組字面量,是用一對方括號括起一組用逗號隔開的 javascript 值,例如:
var aNames=["hello", 12, true , null];
[html]
1.2 對象字面量
對象字面量,是通過兩個(gè)花括號來定義的。在花括號內(nèi)可以放置任意數(shù)量的“名稱-值”對,定義格 式字符串值”。除了最后一行外,每個(gè)“名稱-值”對后必須有一個(gè)逗號(這與Perl 中的聯(lián)合數(shù)組的定義有些類似)。例如:
[code]
var oCar = {
"color": "red",
"doors" : 4,
"paidFor" : true
};
1.3 混合字面量
我們可以混用對象和數(shù)組字面量,來創(chuàng)建一個(gè)對象數(shù)組,或一個(gè)包含數(shù)組的對象。例如:
{comments:[
{
id:1,
author:"someone1",
url:"http://someone1.x2design.net",
content:"hello"
},
{
id:2,
author:"someone2",
url:"http://someone2.x2design.net",
content:"hello"
},
{
id:3,
author:"someone3",
url:"http://someone3.x2design.net",
content:"hello"
}
]};
1.4 JSON 語法
在Ajax應(yīng)用中,就是服務(wù)器直接生成javascript語句,客戶端獲取后直接用eval方法來獲得這個(gè)對象,這樣就可以省去解析XML的性能損失。同時(shí),在javascript 通信中使用JSON作為數(shù)據(jù)格式的好處很明星,可以立即獲得數(shù)據(jù)的值,因此可以更快的訪問其中包含的數(shù)據(jù)。
var oCarInfo = eval("(" + sJSON + ")");
請記?。涸趈avascript中花括號也是一個(gè)語句。要讓解析器知道這個(gè)花括號表示的是一個(gè)對象而非一個(gè)語句的唯一方法是能否找到封裝它的圓括號(它是用來說明代碼是一個(gè)表達(dá)式而非一個(gè)語句)。
1.5 JSON 編碼和解碼
作為 JSON 資源的一部分,Corockford 開發(fā)了一個(gè)能夠?qū)崿F(xiàn) JSON 和Javascript 對象直接解碼和編碼的工具。這個(gè)工具的源程序可以在 www.crockford.com/JSON/json.js 中下載。
在上面提出用到eval() 存在些固有的不足:它是用來對傳入的任何 Javascript 代碼求值的,而不僅僅針對JSON。因此,當(dāng)涉及企業(yè)級 web 應(yīng)用程序開發(fā)時(shí),它存在很大的安全隱患。為了解決這個(gè)問題,可以使用只用來將 JSON 代碼轉(zhuǎn)換為 Javascript 的解析器 JSON.parse() 方法來實(shí)現(xiàn)。例如:
var oObject = JSON.parse (sJSON);
同時(shí),它也提供了一種將 Javascript 對象轉(zhuǎn)換為 JSON 字符串(數(shù)據(jù)傳輸時(shí)使用的)的工具(在Javascript 中沒有內(nèi)建這種功能支持)。你要做的只是將對象傳入到 JSON.Stringify() 方法。請看下面的例子:
var oCar = new Object();
oCar.doors = 4;
oCar.color = "blue";
oCar.year = 1995;
oCar.drivers = new Array("Penny", "Dan" , "Kris");
document.write(JSON.stringify(oCar));
這段代碼將輸出如下所示的JSON 字符串:
{"doors" : 4, "color" : "blue", "year" :1995, "drivers" : ["Penny", "Dan" , "Kris"]}
2. JSON 與 XML
正如上面所說,JSON 與 XML 相比的一大優(yōu)點(diǎn)就是它更加簡單。
請看 XML 數(shù)據(jù)表示實(shí)例:
使用XML表示:
<comments>
<comment>
<id>1</id>
<author>someone1</author>
<url>http://someone1.x2design.net</url>
<content>hello</content>
</comment>
<comment>
<id>2</id>
<author>someone2</author>
<url>http://someone2.x2design.net</url>
<content>someone1</content>
</comment>
<comment>
<id>3</id>
<author>someone3</author>
<url>http://someone3.x2design.net</url>
<content>hello</content>
</comment>
</comments>
使用JSON表示:
{comments:[
{
id:1,
author:"someone1",
url:"http://someone1.x2design.net",
content:"hello"
},
{
id:2,
author:"someone2",
url:"http://someone2.x2design.net",
content:"hello"
},
{
id:3,
author:"someone3",
url:"http://someone3.x2design.net",
content:"hello"
}
]};
很容易發(fā)現(xiàn),許多冗余的信息不見了。由于不需要有與開始標(biāo)簽(opening tag)匹配的結(jié)束標(biāo)簽(closing tag),因此傳送相同的信息所需的字節(jié)數(shù)大大降低了。創(chuàng)始人 Corockford 將其稱之為“XML 的減肥方案”)。
JSON 格式的數(shù)據(jù)與 XML 相比,缺點(diǎn)是對于外行人可讀性更差。當(dāng)然,有一種觀點(diǎn)是,數(shù)據(jù)交換格式不是用肉眼觀察的。如果是通過工具對來回傳送的數(shù)據(jù)進(jìn)行創(chuàng)建和解析,那么的確沒有理由要求數(shù)據(jù)必須使人們易于閱讀。問題的實(shí)質(zhì)在于:存在可用的 JSON 工具。
3. 服務(wù)器端 JSON 工具
java :java JSON 工具,由Douglas Crock ford 開發(fā),可在 www.crockford.com/JSON/java/
中下載,它可以在 JSP 中使用。
4. JSON 優(yōu)勢與缺點(diǎn)
JSON不僅減少了解析XML解析帶來的性能問題和兼容性問題,而且對于javascript來說非常容易使用,可以方便的通過遍歷數(shù)組以及訪問對象屬性來獲取數(shù)據(jù),其可讀性也不錯(cuò),基本具備了結(jié)構(gòu)化數(shù)據(jù)的性質(zhì)。不得不說是一個(gè)很好的辦法,而且事實(shí)上google maps就沒有采用XML傳遞數(shù)據(jù),而是采用了JSON方案。
JSON 另外一個(gè)優(yōu)勢是跨域可行性,例如你在www.xxx.com的網(wǎng)頁里使用是完全可行的,這就意味著你可以跨域傳遞信息。而使用XMLHttpRequest卻獲取不了跨域的信息,這是javascript內(nèi)部的安全性質(zhì)所限制的。
JSON看上去很美,是不是就能完全取代XML呢?事實(shí)并非如此,而原因就在于XML的優(yōu)勢:通用性。要使服務(wù)器端產(chǎn)生語法合格的javascript代碼并不是很容易做到的,這主要發(fā)生在比較龐大的系統(tǒng),服務(wù)器端和客戶端有不同的開發(fā)人員。它們必須協(xié)商對象的格式,這很容易造成錯(cuò)誤。
無論如何,JSON是一個(gè)誘人的技術(shù),準(zhǔn)備做一個(gè)大量的試用。希望屆時(shí)可以獲取大的性能提高。
1. 什么是 JSON
JSON概念很簡單,JSON 是一種輕量級的數(shù)據(jù)格式,他基于 javascript 語法的子集,即數(shù)組和對象表示。由于使用的是 javascript 語法,因此JSON 定義可以包含在javascript 文件中,對其的訪問無需通過基于 XML 的語言來額外解析。不過在使用 JSON 之前,很重要的一點(diǎn)是理解 javascript 中數(shù)組及對象字面量的特殊語法。
1.1 數(shù)組字面量
數(shù)組字面量,是用一對方括號括起一組用逗號隔開的 javascript 值,例如:
復(fù)制代碼 代碼如下:
var aNames=["hello", 12, true , null];
[html]
1.2 對象字面量
對象字面量,是通過兩個(gè)花括號來定義的。在花括號內(nèi)可以放置任意數(shù)量的“名稱-值”對,定義格 式字符串值”。除了最后一行外,每個(gè)“名稱-值”對后必須有一個(gè)逗號(這與Perl 中的聯(lián)合數(shù)組的定義有些類似)。例如:
[code]
var oCar = {
"color": "red",
"doors" : 4,
"paidFor" : true
};
1.3 混合字面量
我們可以混用對象和數(shù)組字面量,來創(chuàng)建一個(gè)對象數(shù)組,或一個(gè)包含數(shù)組的對象。例如:
復(fù)制代碼 代碼如下:
{comments:[
{
id:1,
author:"someone1",
url:"http://someone1.x2design.net",
content:"hello"
},
{
id:2,
author:"someone2",
url:"http://someone2.x2design.net",
content:"hello"
},
{
id:3,
author:"someone3",
url:"http://someone3.x2design.net",
content:"hello"
}
]};
1.4 JSON 語法
在Ajax應(yīng)用中,就是服務(wù)器直接生成javascript語句,客戶端獲取后直接用eval方法來獲得這個(gè)對象,這樣就可以省去解析XML的性能損失。同時(shí),在javascript 通信中使用JSON作為數(shù)據(jù)格式的好處很明星,可以立即獲得數(shù)據(jù)的值,因此可以更快的訪問其中包含的數(shù)據(jù)。
var oCarInfo = eval("(" + sJSON + ")");
請記?。涸趈avascript中花括號也是一個(gè)語句。要讓解析器知道這個(gè)花括號表示的是一個(gè)對象而非一個(gè)語句的唯一方法是能否找到封裝它的圓括號(它是用來說明代碼是一個(gè)表達(dá)式而非一個(gè)語句)。
1.5 JSON 編碼和解碼
作為 JSON 資源的一部分,Corockford 開發(fā)了一個(gè)能夠?qū)崿F(xiàn) JSON 和Javascript 對象直接解碼和編碼的工具。這個(gè)工具的源程序可以在 www.crockford.com/JSON/json.js 中下載。
在上面提出用到eval() 存在些固有的不足:它是用來對傳入的任何 Javascript 代碼求值的,而不僅僅針對JSON。因此,當(dāng)涉及企業(yè)級 web 應(yīng)用程序開發(fā)時(shí),它存在很大的安全隱患。為了解決這個(gè)問題,可以使用只用來將 JSON 代碼轉(zhuǎn)換為 Javascript 的解析器 JSON.parse() 方法來實(shí)現(xiàn)。例如:
var oObject = JSON.parse (sJSON);
同時(shí),它也提供了一種將 Javascript 對象轉(zhuǎn)換為 JSON 字符串(數(shù)據(jù)傳輸時(shí)使用的)的工具(在Javascript 中沒有內(nèi)建這種功能支持)。你要做的只是將對象傳入到 JSON.Stringify() 方法。請看下面的例子:
復(fù)制代碼 代碼如下:
var oCar = new Object();
oCar.doors = 4;
oCar.color = "blue";
oCar.year = 1995;
oCar.drivers = new Array("Penny", "Dan" , "Kris");
document.write(JSON.stringify(oCar));
這段代碼將輸出如下所示的JSON 字符串:
{"doors" : 4, "color" : "blue", "year" :1995, "drivers" : ["Penny", "Dan" , "Kris"]}
2. JSON 與 XML
正如上面所說,JSON 與 XML 相比的一大優(yōu)點(diǎn)就是它更加簡單。
請看 XML 數(shù)據(jù)表示實(shí)例:
使用XML表示:
復(fù)制代碼 代碼如下:
<comments>
<comment>
<id>1</id>
<author>someone1</author>
<url>http://someone1.x2design.net</url>
<content>hello</content>
</comment>
<comment>
<id>2</id>
<author>someone2</author>
<url>http://someone2.x2design.net</url>
<content>someone1</content>
</comment>
<comment>
<id>3</id>
<author>someone3</author>
<url>http://someone3.x2design.net</url>
<content>hello</content>
</comment>
</comments>
使用JSON表示:
復(fù)制代碼 代碼如下:
{comments:[
{
id:1,
author:"someone1",
url:"http://someone1.x2design.net",
content:"hello"
},
{
id:2,
author:"someone2",
url:"http://someone2.x2design.net",
content:"hello"
},
{
id:3,
author:"someone3",
url:"http://someone3.x2design.net",
content:"hello"
}
]};
很容易發(fā)現(xiàn),許多冗余的信息不見了。由于不需要有與開始標(biāo)簽(opening tag)匹配的結(jié)束標(biāo)簽(closing tag),因此傳送相同的信息所需的字節(jié)數(shù)大大降低了。創(chuàng)始人 Corockford 將其稱之為“XML 的減肥方案”)。
JSON 格式的數(shù)據(jù)與 XML 相比,缺點(diǎn)是對于外行人可讀性更差。當(dāng)然,有一種觀點(diǎn)是,數(shù)據(jù)交換格式不是用肉眼觀察的。如果是通過工具對來回傳送的數(shù)據(jù)進(jìn)行創(chuàng)建和解析,那么的確沒有理由要求數(shù)據(jù)必須使人們易于閱讀。問題的實(shí)質(zhì)在于:存在可用的 JSON 工具。
3. 服務(wù)器端 JSON 工具
java :java JSON 工具,由Douglas Crock ford 開發(fā),可在 www.crockford.com/JSON/java/
中下載,它可以在 JSP 中使用。
4. JSON 優(yōu)勢與缺點(diǎn)
JSON不僅減少了解析XML解析帶來的性能問題和兼容性問題,而且對于javascript來說非常容易使用,可以方便的通過遍歷數(shù)組以及訪問對象屬性來獲取數(shù)據(jù),其可讀性也不錯(cuò),基本具備了結(jié)構(gòu)化數(shù)據(jù)的性質(zhì)。不得不說是一個(gè)很好的辦法,而且事實(shí)上google maps就沒有采用XML傳遞數(shù)據(jù),而是采用了JSON方案。
JSON 另外一個(gè)優(yōu)勢是跨域可行性,例如你在www.xxx.com的網(wǎng)頁里使用是完全可行的,這就意味著你可以跨域傳遞信息。而使用XMLHttpRequest卻獲取不了跨域的信息,這是javascript內(nèi)部的安全性質(zhì)所限制的。
JSON看上去很美,是不是就能完全取代XML呢?事實(shí)并非如此,而原因就在于XML的優(yōu)勢:通用性。要使服務(wù)器端產(chǎn)生語法合格的javascript代碼并不是很容易做到的,這主要發(fā)生在比較龐大的系統(tǒng),服務(wù)器端和客戶端有不同的開發(fā)人員。它們必須協(xié)商對象的格式,這很容易造成錯(cuò)誤。
無論如何,JSON是一個(gè)誘人的技術(shù),準(zhǔn)備做一個(gè)大量的試用。希望屆時(shí)可以獲取大的性能提高。
您可能感興趣的文章:
相關(guān)文章
Ajax實(shí)現(xiàn)城市二級聯(lián)動(三)
這篇文章主要為大家詳細(xì)介紹了Ajax實(shí)現(xiàn)城市二級聯(lián)動的方法,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02
ajax+php 谷歌搜索框自動填充功能 實(shí)例代碼
應(yīng)用Ajax技術(shù) 結(jié)合php語言寫的簡單的類谷歌搜索框自動填充功能。2009-11-11
AJAX和WebService實(shí)現(xiàn)郵箱驗(yàn)證(無刷新驗(yàn)證郵件地址是否合法)
首先在項(xiàng)目里面添加服務(wù)引用,驗(yàn)證 Email 地址是否正確(郵件地址合法、只是域名正確、郵件服務(wù)器沒有找到等等)感興趣的朋友可以參考下哈2013-05-05
ajax實(shí)現(xiàn)的提交文章前進(jìn)行敏感詞審核的代碼
在做“文章敏感詞匯審核”功能的時(shí)候,開始在把“審核”放在插入數(shù)據(jù)庫的時(shí)候,后來想有一個(gè)功能,能在用戶點(diǎn)擊“提交”按鈕的時(shí)候,給一個(gè)提示。這樣相對“友好”那么點(diǎn)。2010-02-02
四步輕松實(shí)現(xiàn)ajax發(fā)送異步請求
這篇文章主要教大家輕松實(shí)現(xiàn)ajax發(fā)送異步請求,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-10-10
kkpager 實(shí)現(xiàn)ajax分頁查詢功能
kkpager 實(shí)現(xiàn)ajax分頁查詢功能,前臺分頁數(shù)據(jù),適合數(shù)據(jù)少量的時(shí)候,因?yàn)榉猪摰臄?shù)據(jù)是從后臺獲取的,大數(shù)據(jù)的話不建議使用 ,具體前后臺代碼大家參考下本文吧2017-08-08

