對(duì)象與json-8.24

本章目標(biāo)

  1. 認(rèn)識(shí)了解對(duì)象
  2. 如何創(chuàng)建對(duì)象
  3. 對(duì)象有數(shù)組的區(qū)別于聯(lián)系

知識(shí)點(diǎn)?

一知纷、 為什么要有對(duì)象 ,怎么創(chuàng)建對(duì)象

對(duì)象嗎?就當(dāng)和現(xiàn)實(shí)中的對(duì)象一樣:一個(gè)"人"對(duì)象

var person = new Object();
    person.age = 18;
    person.weight = "123kg";
    person.height = "170cm";
    person.arm = 2;//兩個(gè)臂膀
    person.leg = 2;
var person={"age":18,"weight":"123kg","height":"170cm","arm":2,"leg":2}

上面創(chuàng)建的對(duì)象,描述了現(xiàn)實(shí)中的人的一些特性:年齡 18;重量 123kg;身高 170cm;不是殘疾(這個(gè)是我推斷的); 其實(shí)數(shù)組也能完成這樣的工作

對(duì)象是一堆屬性的集合,其實(shí)它和數(shù)組是相通的

二、對(duì)象與數(shù)組的區(qū)別于聯(lián)系

var obj = new Object();//創(chuàng)建一個(gè)對(duì)象
obj.property = "value";//使用點(diǎn)語(yǔ)法給對(duì)象添加屬性
alert(obj);//只會(huì)輸出含糊的[object Object]
alert(obj.property);//真正的數(shù)據(jù)全存儲(chǔ)在它的屬性上面
var obj={"property":"value"}

2.1 用數(shù)組的方式創(chuàng)建一個(gè)對(duì)象

上面創(chuàng)建的對(duì)象,描述了現(xiàn)實(shí)中的人的一些特性:年齡 18;重量 123kg;身高 170cm; 其實(shí)數(shù)組也能完成這樣的工作

var person = new Array();
    person[0] = 18;
    person[1] = "123kg";
    person[2] = "170cm";
    person[3] = 2;
    person[4] = 2;

但是這樣的表達(dá)方式,沒(méi)人能看出這是一個(gè)"人"對(duì)象,使用數(shù)字下標(biāo)沒(méi)有對(duì)象的屬性明了,代碼難于理解. 其實(shí)數(shù)組可以使用字符串下標(biāo)的

var person = new Array();
    person["age"] = 18;//注意,中括號(hào)里的下標(biāo)是一個(gè)字符串,所以需要使用引號(hào)
    person["weight"] = "123kg";
    person["height"] = "170cm";
    person["arm"] = 2;
    person["leg"] = 2;

2.2 數(shù)組和對(duì)象是相通的

var arr = new Array();
    var obj = new Object();
    alert(typeof arr);//object
    alert(typeof obj);//object

所以,數(shù)組用字符串下標(biāo),事實(shí)上也是在給其添加屬性


var arr =[1,2,3];
arr["property"]="some data";
alert(arr.property);//"some data"
//但注意的是,數(shù)組的length屬性只能報(bào)告具有數(shù)字下標(biāo)的元素的個(gè)數(shù)
alert(arr.length);//3

2.3 循環(huán)對(duì)象與數(shù)組

對(duì)于數(shù)組,我們可以使用for對(duì)其進(jìn)行遍歷,但for循環(huán)只能遍歷具有數(shù)字下標(biāo)的元素

var arr =[1,2,3,4];
arr["stringIndex"]="some data";//這個(gè)不會(huì)被遍歷到
alert(arr.length);//arr.length屬性也不報(bào)告包含此元素
for (var i=0;i< arr.length;i++) {
alert(arr[i]);//i只會(huì)是數(shù)字,所以不能遍歷字符串下標(biāo)的元素
}

for.. in...循環(huán)出現(xiàn)了 (對(duì)于研究對(duì)象,for in循環(huán)太有用了)

var arr = [1,2,3,4,5,6];
arr["property"]=78;//會(huì)被遍歷到,因?yàn)樗菍傩?
for (var i in arr) {
      alert(i+" : "+arr[i]);
}

對(duì)于數(shù)組,我們可以使用for對(duì)其進(jìn)行遍歷,但for循環(huán)只能遍歷具有數(shù)字下標(biāo)的元素

var obj={   "age":12,"height":170};

for (var i in obj) {//i將會(huì)被列舉為鍵名,就是所說(shuō)的字符串的下標(biāo)

alert(i+"\n"+obj[i]);/*將會(huì)以類(lèi)似age 
                                                 12

        這樣的格式分別輸出它的鍵名鍵值對(duì)

        */

    }

JSON (JavaScript Object Notation)

本章目標(biāo)

1互站, 了解json 使用json格式

知識(shí)點(diǎn)講解

一、 json

是一種輕量級(jí)的數(shù)據(jù)交換格式僵缺,我們稱之為JavaScript對(duì)象表示法

1.1 JSON結(jié)構(gòu):

數(shù)據(jù)在名稱/值對(duì)中
數(shù)據(jù)由逗號(hào)分隔
花括號(hào)保存對(duì)象
方括號(hào)保存數(shù)組

var peson= {
"name":"Bill Gates",
"street":"Fifth Avenue New York 666",
"age":56,
"phone":"555 1234567"};

1.2 JSON值:

數(shù)字(整數(shù)或浮點(diǎn)數(shù))
字符串(在雙引號(hào)中)
邏輯值(true 或 false)
數(shù)組(在方括號(hào)中)
對(duì)象(在花括號(hào)中)
null

{ "firstName":"John" , "lastName":"Doe" }

{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }]

}

1.3 解析和序列化

如果是載入的JSON文件胡桃,我們需要對(duì)其進(jìn)行使用,那么就必須對(duì)JSON字符串解析成原生的JavaScript值磕潮。當(dāng)然翠胰,如果是原生的JavaScript對(duì)象或數(shù)組,也可以轉(zhuǎn)換成JSON字符串自脯。
對(duì)于講JSON字符串解析為JavaScript原生值之景,早期采用的是eval()函數(shù)。但這種方法既不安全膏潮,可能會(huì)執(zhí)行一些惡意代碼锻狗。

var txt = '{ "employees" : [' +

'{ "firstName":"Bill" , "lastName":"Gates" },' +

'{ "firstName":"George" , "lastName":"Bush" },' +

'{ "firstName":"Thomas" , "lastName":"Carter" } ]}';

eval("("+txt+")");
JSON.parse(txt);//字符轉(zhuǎn)json
JSON.stringify(obj)//json轉(zhuǎn) 字符

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市焕参,隨后出現(xiàn)的幾起案子轻纪,更是在濱河造成了極大的恐慌,老刑警劉巖叠纷,帶你破解...
    沈念sama閱讀 221,198評(píng)論 6 514
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件刻帚,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡涩嚣,警方通過(guò)查閱死者的電腦和手機(jī)崇众,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,334評(píng)論 3 398
  • 文/潘曉璐 我一進(jìn)店門(mén)掂僵,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人顷歌,你說(shuō)我怎么就攤上這事看峻。” “怎么了衙吩?”我有些...
    開(kāi)封第一講書(shū)人閱讀 167,643評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵互妓,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我坤塞,道長(zhǎng)冯勉,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 59,495評(píng)論 1 296
  • 正文 為了忘掉前任摹芙,我火速辦了婚禮灼狰,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘浮禾。我一直安慰自己交胚,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,502評(píng)論 6 397
  • 文/花漫 我一把揭開(kāi)白布盈电。 她就那樣靜靜地躺著蝴簇,像睡著了一般。 火紅的嫁衣襯著肌膚如雪匆帚。 梳的紋絲不亂的頭發(fā)上熬词,一...
    開(kāi)封第一講書(shū)人閱讀 52,156評(píng)論 1 308
  • 那天,我揣著相機(jī)與錄音吸重,去河邊找鬼互拾。 笑死,一個(gè)胖子當(dāng)著我的面吹牛嚎幸,可吹牛的內(nèi)容都是我干的颜矿。 我是一名探鬼主播,決...
    沈念sama閱讀 40,743評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼嫉晶,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼骑疆!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起车遂,我...
    開(kāi)封第一講書(shū)人閱讀 39,659評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤封断,失蹤者是張志新(化名)和其女友劉穎斯辰,沒(méi)想到半個(gè)月后舶担,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,200評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡彬呻,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,282評(píng)論 3 340
  • 正文 我和宋清朗相戀三年衣陶,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了柄瑰。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,424評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡剪况,死狀恐怖教沾,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情译断,我是刑警寧澤授翻,帶...
    沈念sama閱讀 36,107評(píng)論 5 349
  • 正文 年R本政府宣布,位于F島的核電站孙咪,受9級(jí)特大地震影響堪唐,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜翎蹈,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,789評(píng)論 3 333
  • 文/蒙蒙 一淮菠、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧荤堪,春花似錦合陵、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,264評(píng)論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至碎赢,卻和暖如春举庶,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背揩抡。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,390評(píng)論 1 271
  • 我被黑心中介騙來(lái)泰國(guó)打工户侥, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人峦嗤。 一個(gè)月前我還...
    沈念sama閱讀 48,798評(píng)論 3 376
  • 正文 我出身青樓蕊唐,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親烁设。 傳聞我的和親對(duì)象是個(gè)殘疾皇子替梨,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,435評(píng)論 2 359

推薦閱讀更多精彩內(nèi)容