成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JavaScript對象和JSON

wuyumin / 3359人閱讀

摘要:,指的對象表示法,它本身是個字符串,是一種數(shù)據(jù)交換格式,并非對象。字符串必須使用雙引號表示,不能使用單引號。數(shù)組或?qū)ο笞詈笠粋€成員的后面,不能有逗號。不合法的會在解析成對象時,出現(xiàn)錯誤。替代方法對象下雖然提供了完整的字符串和對象的轉(zhuǎn)換方法。

JSON(JavaScript Object Notation),指JavaScript的對象表示法,它本身是個字符串,是一種數(shù)據(jù)交換格式,并非對象。通常所提的JSON對象實際是JSON字符串解析成對象的結(jié)果,或是瀏覽器window對象下的JSON對象。

而且JSON不止用于JavaScript中,其廣泛用于數(shù)據(jù)交換。

JSON和JavaScript對象

一個JSON文件,或一段JSON字符串,通常是這樣的:

[{
    "name": "用戶權(quán)限管理",
    "code": "99990002",
    "icon": "modicon-1",
    "items": [{
        "name": "模塊權(quán)限",
        "code": "999900020009",
        "url": "",
        "isBlank": false,
        "items": [{
            "name": "向?qū)0?,
            "code": "9999000200090003",
            "url": "pages/accLayoutTest.html",
            "isBlank": false,
            "items": []
        }, {
            "name": "模塊管理我們的",
            "code": "9999000200090001",
            "url": "pages/contentPageTest.html",
            "isBlank": false,
            "items": []
        }]
    }]
}, ... ]

而這樣類似的JavaScript對象則是這樣的:

var menuData = [{
    name: "用戶權(quán)限管理",
    code: "99990002",
    icon: "modicon-1",
    items: [{
        name: "模塊權(quán)限",
        code: "999900020009",
        url: "",
        isBlank: false,
        items: [{
            name: "向?qū)0?,
            code: "9999000200090003",
            url: "pages/accLayoutTest.html",
            isBlank: false,
            items: []
        }, {
            name: "模塊管理我們的",
            code: "9999000200090001",
            url: "pages/contentPageTest.html",
            isBlank: false,
            items: []
        }]
    }]
}, ...]

兩者非常的相似,所不同的是就是JavaScript對象中屬性名,也就是對象的key值是可以沒有引號的,其值為字符串時,使用""""包裹均可。 因此我們很多人將第一段代碼塊里所寫的JSON稱為JSON對象,實際上,它并不是一個對象,只是一個單純的字符串而已,但是它符合JSON的語法規(guī)則,可以很方便地轉(zhuǎn)化為JavaScript對象,或者方便地用于數(shù)據(jù)交換。

以下我們來了解一下JSON。

JSON語法

JSON語法規(guī)則

JSON 語法是 JavaScript 對象表示語法的子集,其基本原則如下:

數(shù)據(jù)在鍵值對中

數(shù)據(jù)由逗號分隔

花括號保存對象

方括號保存數(shù)組

JSON的值

數(shù)字(整數(shù)或浮點數(shù))

字符串(在雙引號中)

邏輯值(truefalse

數(shù)組(在方括號中[]

對象(在花括號中{}

null

JSON作為一種數(shù)據(jù)交換格式,為了保證其能被正確方便的解析,其格式有嚴(yán)格的要求,必須遵循以下規(guī)則:

復(fù)合類型的值只能是數(shù)組對象,不能是函數(shù)、正則表達(dá)式對象、日期對象。

簡單類型的值只有四種:字符串、數(shù)值(必須以十進(jìn)制表示)、布爾值和null(不能使用NaN, Infinity, -Infinityundefined)。

字符串必須使用雙引號表示,不能使用單引號。

對象的鍵名必須放在雙引號里面。

數(shù)組或?qū)ο笞詈笠粋€成員的后面,不能有逗號。

數(shù)值前不能加0。

以下是合法的JSON格式示例:

["one", "two", "three"]

{
    "one": 1,
    "two": 2,
    "three": 3
}

{
    "names": [
        "張三",
        "李四"
    ]
}

[
    { "name": "張三" },
    { "name": "李四" }
]

下面這些就是不合法的:

{
    name: "張三",
    "age": 32
} // 屬性名必須使用雙引號

[32, 64, 128, 0xFFF] // 不能使用十六進(jìn)制值

{
    "name": "張三",
    "age": undefined
} // 不能使用undefined

{
    "name": "張三",
    "birthday": new Date("Fri, 26 Aug 2011 07:13:10 GMT"),
    "getName": function() {
        return this.name;
    }
} // 不能使用函數(shù)和日期對象

{
    "name": "李四",
    "age": 018
} // 數(shù)值前不能有0

以上代碼中為了指出錯誤所在,使用了JavaScript的注釋法,實際JSON中是不能有注釋的。

不合法的JSON會在解析成JavaScript對象時,出現(xiàn)錯誤。

JSON和JavaScript對象的轉(zhuǎn)化 window.JSON

JSON作為一種數(shù)據(jù)交換格式,被寫入了ECMAScript 5,在IE8及之后的瀏覽器都提供了一個JSON對象,用于對JSON進(jìn)行解析和序列化。

JSON.parse()

此方法接收一個JSON字符串,返回解析后的JavaScript對象,通常為ObjectArray。

// JSON數(shù)據(jù)
var humansData = "[{"name":"zs","age":28},{"name":"ls","age":26}]";
// 解析為JavaScript對象
var humans = JSON.parse(humansData);

// 之后就可以訪問其元素或?qū)傩粤?humans[1].name; // ls
humans[1].age; // 26

如果傳入不合法的JSON,則會在JSON.parse時報錯。

為什么我們在ajax請求中,即使請求的數(shù)據(jù)為JSON,我們不用解析就能直接使用呢?

// test.text內(nèi)容
/*
[{
    "name":"zs",
    "age":28
},{
    "name":"ls",
    "age":26
}]
*/

$.ajax({
    url: "./test/test.text",
    dataType: "JSON"
}).done(function(data){
    console.dir(data); // Array[2]
    console.log(data[0].name); // zs
    // 這里沒有轉(zhuǎn)化為js對象就能訪問其屬性?!    
});

這里實際是因為指定了dataType為JSON,從而進(jìn)行了自動轉(zhuǎn)化,所以能直接在成功回調(diào)中使用其屬性。如果去掉dataType的指定,就不能直接訪問其屬性了,因為未轉(zhuǎn)化時,其本身是一個字符串。第一行輸出為test.text的內(nèi)容,第二行輸出undefined

JSON.stringify()

此方法可接收一個JavaScript值將轉(zhuǎn)化為JSON字符串,此字符串可被JSON.parse還原。

var humans = [{
    "name": "zs",
    "age": 28,
    "birth": new Date()
}, {
    "name": "ls",
    "age": 26,
    "birth": new Date()
}];

// 轉(zhuǎn)化為JSON字符串
JSON.stringify(humans);
// "[{"name":"zs","age":28,"birth":"2016-10-25T07:24:11.701Z"},{"name":"ls","age":26,"birth":"2016-10-25T07:24:11.701Z"}]"

前面我們講到了JSON中并非支持所有的JavaScript類型,因此此方法對一些JSON不可接受的值有所處理:原始對象中,如果有一個成員的值是undefined、函數(shù)或XML對象,這個成員會被省略。如果數(shù)組的成員是undefined、函數(shù)或XML對象,則這些值被轉(zhuǎn)成null。

我們還發(fā)現(xiàn),JSON中是不支持Date對象的,而上述轉(zhuǎn)化為字符串的結(jié)果中正確包含了birth的值,其為一個日期格式的字符串。這是因為在Date對象上有一個名為toJSON的方法,JSON.stringify在序列化時,實際是調(diào)用了這個方法來輸出結(jié)果的。

如果一個被序列化的對象擁有 toJSON 方法,那么該 toJSON 方法就會覆蓋該對象默認(rèn)的序列化行為:不是那個對象被序列化,而是調(diào)用 toJSON 方法后的返回值會被序列化,例如:

var obj = {
    foo: "foo",
    toJSON: function() {
        return "bar";
    }
};

JSON.stringify(obj); // ""bar"" 
JSON.stringify({x: obj}); // "{"x":"bar"}"

了解即可,詳見: MDN:JSON.stringify(){.doc-link}

我們可能經(jīng)??吹降氖?b>JSON.stringify( obj , null , 4),這樣是什么意思呢?

對于上例,替換最后一句,結(jié)果如下所示:

JSON.stringify(humans, null, 4);
// "[
//     {
//         "name": "zs",
//         "age": 28,
//         "birth": "2016-10-25T07:24:11.701Z"
//     },
//     {
//         "name": "ls",
//         "age": 26,
//         "birth": "2016-10-25T07:24:11.701Z"
//     }
// ]"

其實沒什么變化,不過是加上了空格縮進(jìn),使得可讀性更高了。

其余兩個參數(shù)的說明如下:

第二個參數(shù)可指定序列化時的操作。

如果該參數(shù)是一個函數(shù),則在序列化過程中,被序列化的值的每個屬性都會經(jīng)過該函數(shù)的轉(zhuǎn)換和處理;

如果該參數(shù)是一個數(shù)組,則只有包含在這個數(shù)組中的屬性名才會被序列化到最終的 JSON 字符串中;

如果該參數(shù)為null或者未提供,則對象所有的屬性都會被序列化;

第三個參數(shù)用于指定縮進(jìn)用的空白字符串,用于美化輸出(pretty-print);

如果參數(shù)是個數(shù)字,它代表有多少的空格;上限為10。該值若小于1,則意味著沒有空格;

如果該參數(shù)為字符串(字符串的前十個字母),該字符串將被作為空格;

如果該參數(shù)沒有提供(或者為null)將沒有空格。

替代方法

window.JSON對象下雖然提供了完整的JSON字符串和JavaScript對象的轉(zhuǎn)換方法。但是在IE8(兼容模式)以及更低版本的IE下沒有提供這個對象,因此我們需要一些替代方案。

jQuery中提供了parseJSON這樣一個方法來替代JSON.parse,它接收一個標(biāo)準(zhǔn)格式的JSON字符串,返回一個解析后的JavaScript對象。

使用http://www.json.org/提供了一個json.js,這樣ie8(兼容模式),ie7和ie6就可以支持JSON對象以及其stringify()parse()方法; 可以在https://github.com/douglascrockford/JSON-js上獲取到這個js,一般現(xiàn)在用json2.js。

還可以使用 eval("(" + jsonstr + ")") ; 來將json字符串轉(zhuǎn)換成json對象,注意需要在json字符外包裹一對小括號。但最好不要使用這種方式,因為這種方式不安全,eval會將JSON字符串作為JavaScript語句來執(zhí)行,JSON中的風(fēng)險代碼將被執(zhí)行。

參考鏈接

JSON

JSON對象

根本沒有“JSON對象”這回事!

JavaScript標(biāo)準(zhǔn)庫-JSON對象

js對象與JSON字符串互轉(zhuǎn)

我的博客 - JavaScript 原型鏈

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/88200.html

相關(guān)文章

  • JavaScriptJSON JS 對象

    摘要:獨立于語言和平臺,解析器和庫支持許多不同的編程語言。數(shù)據(jù)轉(zhuǎn)換數(shù)據(jù)轉(zhuǎn)換為對象解析器函數(shù)創(chuàng)建包含語法的字符串使用解析器,解析文本并生成對象使用函數(shù)時,必須為傳入的數(shù)據(jù)參數(shù)添加括號,否則會報語法錯誤。 區(qū)別 JSON(JavaScript Object Notation)僅僅是一種數(shù)據(jù)格式(或者叫數(shù)據(jù)形式)。數(shù)據(jù)格式其實就是一種規(guī)范,按照這種規(guī)范來存諸和交換數(shù)據(jù)。就好像 XML 格式一樣。 ...

    Miracle 評論0 收藏0
  • 5分鐘了解JSON那些事兒

    摘要:簡介是對象表示法的縮寫是一種數(shù)據(jù)格式而不是一種編程語言用來表示結(jié)構(gòu)化數(shù)據(jù)是的一個嚴(yán)格子集并不從屬于很多編程語言都可以用數(shù)據(jù)格式語法語法可以表示以下三種類型的值簡單值字符串?dāng)?shù)值布爾值但是不支持對象數(shù)組不支持變量函數(shù)對象實例簡單值字符串?dāng)?shù)字布爾 JSON 簡介 JSON是JavaScript Object Notation(JavaScript對象表示法)的縮寫 JSON是一種數(shù)據(jù)格式,...

    ad6623 評論0 收藏0
  • 深入理解JavaScript系列11:根本沒有“JSON對象”這回事

    摘要:更多資料如果你想了解更多關(guān)于的資料,下面的連接對你絕對有用關(guān)于本文本文轉(zhuǎn)自大叔的深入理解系列。深入理解系列文章,包括了原創(chuàng),翻譯,轉(zhuǎn)載,整理等各類型文章,原文是大叔的一個非常不錯的專題,現(xiàn)將其重新整理發(fā)布。 前言 寫這篇文章的目的是經(jīng)??吹介_發(fā)人員說:把字符串轉(zhuǎn)化為JSON對象,把JSON對象轉(zhuǎn)化成字符串等類似的話題,所以把之前收藏的一篇老外的文章整理翻譯了一下,供大家討論,如有錯誤,...

    darryrzhong 評論0 收藏0
  • 【快速入門系列】深入淺出JSON

    摘要:布爾值和也是有效的形式。同一個對象中絕對不應(yīng)該出現(xiàn)兩個同名屬性。序列化選項還可以接受兩個參數(shù),用于指定以不同方式序列化對象。當(dāng)傳入了有效縮進(jìn)參數(shù)值,結(jié)果字符串就會包含換行符。對第步返回的每個值進(jìn)行相應(yīng)的序列化。 前言 JSON(JavaScript Object Notation,JavaScript對象表示法)是JavaScript的一個嚴(yán)格的子集,利用了JavaScript中的一些...

    liangdas 評論0 收藏0
  • 哎喲,這就是JSON

    摘要:官方的說法,也不是特別的明了,只說明了這是一種輕量級的數(shù)據(jù)交換格式,且基于一個子集。的語法介紹常見數(shù)據(jù)結(jié)構(gòu)有兩種形式,其分別是名稱值對的集合,類似中的對象。比如,則在中是行不通的。 寫這篇文章的緣由 你了解JSON嘛?JSON是JavaScript中對象嘛?JSON可以存儲function對象嘛?JSON的本質(zhì)是什么呢?JSON能寫注釋嘛? 如果你都能答上來,那恭喜你,你對JSON了...

    邱勇 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<