前端开发学习二——由JSON和Object Literal Notation引起的思考
這篇隨筆是今天看公司原來的項目中引用JSON2.js,并調用stringify和parse兩個方法在JavaSript Object Literal Notation和JSON之間轉換引起的思考。
概念梳理: ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?? ??
JSON (JavaScript Object Notation, JavaScript對象表示法) 與Object Literal Notation(對象字面量表示法)
Object Literal Notation的中文翻譯有很多,比如標題寫的對象自變量表示法,又或者文字對象表示法等等,總覺得原來的英文術語翻譯成中文就會經歷一下“裝箱”的過程,變得過于“專業”和“深奧”。好多時候這樣的中文術語還不如英文原詞來的輕松。
Object Literal Notation表示如下:
var person={name: "tonny",
job: "Software Engineer"
}
JSON 是一種輕量級數據交換格式,采用完全獨立于語言的文本格式
JavaScript Object Notation (JSON) is a lightweight, text-based, language- independent data interchange format. ?參考來源:(http://www.ietf.org/rfc/rfc4627.txt)
data interchange format,language- independent,text-based 理清JSON的概念,關鍵在于這三點。
當兩個應用程序、或者兩臺服務器、或者兩種語言之間進行“交流”時,他們都趨向于采用字符串。原因顯而易見,字符串是在所有語言中都可以解析的類型。復雜的數據結構在程序內部被描述成復雜的內存引用,而呈現的時候僅僅是加入了大括號、方括號、尖角括號或者空格等表示的字符串。當然,這個字符串是符合標準的語法要求的。JSON就是這些語法要求中的一種,可以將Object,Array,String,Number,Boolean和null描述成字符串,這樣就可以在程序間進行傳遞了。當然在你需要的時候可以將這些字符串進行編碼后傳遞。
是不是JSON? ? ? ? ? ? ? ? ? ? ? ? ? ? ?? ? ?
{“name”: ”tonny”}
上面的表示是JSON么,它可以是對象常量(Object Literal)也可以是JSON字符串,關鍵是看他在上下文中是怎么運用的。例如:
var person='{ "name" : "tonny"}';//this is a json string
var person={ "name" :"tonny" };
//this is an object literal
Object Literal和JSON的區別: ? ? ? ? ? ? ? ? ? ? ?
JSON中:
Key值必須用雙引號表示,單引號都不行。所有的字符串都必須加上雙引號
Values可以是String、Number、Object、Array、true、false、null. No Function
從以上啰嗦的一段可以看到,我一直在強調字符串。所以JSON只是一種表示成字符串的數據交換格式。有種說法將對象字面量(JavaScript Object Literals)叫做“JSON Objects”,他們僅僅是看上去相似而已,然而這樣的叫法是錯誤的。
然而,雖然對象字面量(JavaScript Object Literals)不可以叫做“JSON Objects“,單事實上存在JSON object,當然這和object literal完全是兩碼事了。
回到正題 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?? ?
好了,從這里開始回到我一開始的問題了。根據 ECMA-262(ECMAScript)第 5 版中描述,JSON 是一個包含了函數 parse 和 stringify 的簡單對象。 parse 函數用來解析一個 JSON 文本(一個 JSON 格式的字符串)到一個 ECMAScript 值(例如 JSON 對象被解析為 ECMAScript 對象, JSON 數組被解析為 ECMAScript 數組,其它類型以此類推);stringify 則相反,它是將一個 ECMAScript 值解析為一個 JSON 格式的字符串, 比如將一個 ECMAScript 對象解析為一個 JSON 對象的字符串。JSON 對象是在 ECMAScript 第 5 版中實現的,此版于 2009 年 12 月發布;IE6 IE7 與 IE8(Q) (IE8的怪異模式相當于 IE 5.5) 發布時間比較早,沒有在其 Javascript 引擎中實現該對象。在沒有實現JSON對象的瀏覽器中,可以使用 window.eval() 或 new Function(){} 的方式解析 JSON 格式字符串。例如:
var jsonStr='{"key1":"value1","key2":"value2","key3":"value3"}';var json1 = eval("(" + jsonStr + ")");
var json2 = (new Function("return" + jsonStr))();
var result1;
for(p in json1){
result1 += p + ":" + json1[p];
}
alert(result1);
for(p in json2){
result1 += p + ":" + json2[p];
}
alert(result2);
??? 這種解析 JSON 格式字符串的簡單實現存在安全問題,被插入的惡意 JSON 字符串(比如獲取用戶的 cookie 信息)可能被解析并執行。 可以使用一些經過驗證的安全成熟的的解決方案,例如 json2.js 中的 JSON.parse() 或 jQuery.parseJSON()。
最后附上msdn中對JSON.stringify()和JSON.parse()方法調用的示例:
var contact = new Object();contact.firstname = "Jesper";
contact.surname = "Aaberg";
contact.phone = ["555-0100", "555-0120"];
var memberfilter = new Array();
memberfilter[0] = "surname";
memberfilter[1] = "phone";
var jsonText = JSON.stringify(contact, memberfilter, "\t");
/* The value of jsonText is:
'{
"surname": "Aaberg",
"phone": [
"555-0100",
"555-0120"
]
}'
*/ var continents = new Array();
continents[0] = "Europe";
continents[1] = "Asia";
continents[2] = "Australia";
continents[3] = "Antarctica";
continents[4] = "North America";
continents[5] = "South America";
continents[6] = "Africa";
var jsonText = JSON.stringify(continents, replaceToUpper);
/* The value of jsonText is:
'"EUROPE,ASIA,AUSTRALIA,ANTARCTICA,NORTH AMERICA,SOUTH AMERICA,AFRICA"'
*/
function replaceToUpper(key, value) {
return value.toString().toUpperCase();
} var contact = new Object();
contact.firstname = "Jesper";
contact.surname = "Aaberg";
contact.phone = ["555-0100", "555-0120"];
contact.toJSON = function(key)
{
var replacement = new Object();
for (var val in this)
{
if (typeof (this[val]) === 'string')
replacement[val] = this[val].toUpperCase();
else
replacement[val] = this[val]
}
return replacement;
};
var jsonText = JSON.stringify(contact);
/* The value of jsonText is:
'{"firstname":"JESPER","surname":"AABERG","phone":["555-0100","555-0120"]}'
*/ View Code var jsontext = '{"firstname":"Jesper","surname":"Aaberg","phone":["555-0100","555-0120"]}';
var contact = JSON.parse(jsontext);
var fullname = contact.surname + ", " + contact.firstname;
// The value of fullname is "Aaberg, Jesper" View Code var jsontext = '{ "hiredate": "2008-01-01T12:00:00Z", "birthdate": "2008-12-25T12:00:00Z" }';
var dates = JSON.parse(jsontext, dateReviver);
var string = dates.birthdate.toUTCString();
// The value of string is "Thu, 25 Dec 2008 12:00:00 UTC"
function dateReviver(key, value) {
var a;
if (typeof value === 'string') {
a = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*)?)Z$/.exec(value);
if (a) {
return new Date(Date.UTC(+a[1], +a[2] - 1, +a[3], +a[4],
+a[5], +a[6]));
}
}
return value;
};
今天的探索就到這里了。我的問題理清了,花了好長的時間來寫這篇文章,在理解后再整理寫下來也不是一件容易的事,最直接的效果是可以更深的鞏固自己的理解。OK。明天繼續努力!
轉載于:https://www.cnblogs.com/TonnyGu/archive/2011/09/21/2184407.html
總結
以上是生活随笔為你收集整理的前端开发学习二——由JSON和Object Literal Notation引起的思考的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 利用JavaScript在ASP.NET
- 下一篇: Excel中删除链接