JavaScript之?dāng)?shù)組

數(shù)組的基本理解及規(guī)則

本質(zhì)上少梁,數(shù)組屬于一種特殊的對象。typeof運(yùn)算符會返回數(shù)組的類型是object悬赏。

typeof [1, 2, 3] // "object"

數(shù)組的特殊性體現(xiàn)在丐吓,它的鍵名是按次序排列的一組整數(shù)(0,1柿汛,2…)冗酿。

var arr = ['a', 'b', 'c'];

Object.keys(arr)
// ["0", "1", "2"]

JavaScript語言規(guī)定,對象的鍵名一律為字符串络断,所以裁替,數(shù)組的鍵名其實(shí)也是字符串。之所以可以用數(shù)值讀取貌笨,是因?yàn)榉亲址逆I名會被轉(zhuǎn)為字符串弱判。

var arr = ['a', 'b', 'c'];

arr['0'] // 'a'
arr[0] // 'a'

需要注意的是,這一條在賦值時也成立锥惋。如果一個值可以被轉(zhuǎn)換為整數(shù)昌腰,則以該值為鍵名,等于以對應(yīng)的整數(shù)為鍵名净刮。

var a = [];

a['1000'] = 'abc';
a[1000] // 'abc'

a[1.00] = 6;
a[1] // 6

之前說過對象有兩種讀取成員的方法:“點(diǎn)”結(jié)構(gòu)(object.key)和方括號結(jié)構(gòu)(object[key])剥哑。但是,對于數(shù)值的鍵名淹父,不能使用點(diǎn)結(jié)構(gòu)株婴。

var arr = [1, 2, 3];
arr.0 // SyntaxError

上面代碼中,arr.0的寫法不合法暑认,因?yàn)閱为?dú)的數(shù)值不能作為標(biāo)識符(identifier)困介。所以,數(shù)組成員只能用方括號arr[0]表示(方括號是運(yùn)算符蘸际,可以接受數(shù)值)座哩。

length屬性

數(shù)組的length屬性,返回數(shù)組的成員數(shù)量粮彤。

['a', 'b', 'c'].length // 3

length屬性是可寫的根穷。如果人為設(shè)置一個小于當(dāng)前成員個數(shù)的值姜骡,該數(shù)組的成員會自動減少到length設(shè)置的值。

var arr = [ 'a', 'b', 'c' ];
arr.length // 3

arr.length = 2;
arr // ["a", "b"]

上面代碼表示屿良,當(dāng)數(shù)組的length屬性設(shè)為2(即最大的整數(shù)鍵只能是1)那么整數(shù)鍵2(值為c)就已經(jīng)不在數(shù)組中了圈澈,被自動刪除了。

將數(shù)組清空的一個有效方法尘惧,就是將length屬性設(shè)為0康栈。

如果人為設(shè)置length大于當(dāng)前元素個數(shù),則數(shù)組的成員數(shù)量會增加到這個值喷橙,新增的位置都是空位啥么。

值得注意的是,由于數(shù)組本質(zhì)上是對象的一種贰逾,所以我們可以為數(shù)組添加屬性悬荣,但是這不影響length屬性的值。

var a = [];

a['p'] = 'abc';
a.length // 0

a[2.1] = 'abc';
a.length // 0

數(shù)組的遍歷

for...in循環(huán)不僅可以遍歷對象似踱,也可以遍歷數(shù)組隅熙,畢竟數(shù)組只是一種特殊對象。

但是核芽,for...in不僅會遍歷數(shù)組所有的數(shù)字鍵囚戚,還會遍歷非數(shù)字鍵。

var a = [1, 2, 3];
a.foo = true;

for (var key in a) {
  console.log(key);
}
// 0
// 1
// 2
// foo

上面代碼在遍歷數(shù)組時轧简,也遍歷到了非整數(shù)鍵foo驰坊。所以,不推薦使用for...in遍歷數(shù)組哮独。

數(shù)組的遍歷可以考慮使用for循環(huán)或while循環(huán)拳芙。

var a = [1, 2, 3];

// for循環(huán)
for(var i = 0; i < a.length; i++) {
  console.log(a[i]);
}

// while循環(huán)
var i = 0;
while (i < a.length) {
  console.log(a[i]);
  i++;
}

var l = a.length;
while (l--) {
  console.log(a[l]);
}

上面代碼是三種遍歷數(shù)組的寫法。最后一種寫法是逆向遍歷皮璧,即從最后一個元素向第一個元素遍歷舟扎。

數(shù)組常用方法

  • 元素添加/刪除
// 直接使用索引
var a=new Array(1,2,3);
a[3]=4;
console.log(a);//[1, 2, 3, 4]

// 棧方法(length屬性自動變化)
var a = new Array(1,2,3);
a.push(4);
console.log(a);//[1, 2, 3, 4]
console.log(a.length);//4
console.log(a.pop());//4
console.log(a); //[1, 2, 3]
console.log(a.length);//3

// 隊(duì)列方法(length屬性自動變化)
var a=new Array(1,2,3);
a.unshift(4);
console.log(a);//[4, 1, 2, 3]
console.log(a.length);//4
console.log(a.shift());//4
console.log(a); //[1, 2, 3]
console.log(a.length);//3

除此之外我們還有一位全能選手-splice方法,方法有三個參數(shù):
1.開始索引
2.刪除元素的位移
3.插入的新元素悴务,當(dāng)然也可以寫多個

splice方法返回一個由刪除元素組成的新數(shù)組睹限,沒有刪除則返回空數(shù)組

// 刪除
var a = new Array(1,2,3,4,5);
console.log(a.splice(1,3));//[2, 3, 4]
console.log(a.length);//2
console.log(a);//[1,5]

//插入與替換
var a = [1,2,3,4,5];
a.splice(1,0,9,99,999);
console.log(a.length); //8
console.log(a);//[1, 9, 99, 999, 2, 3, 4, 5]
a.splice(1,3,8,88,888);
console.log(a.length);//8
console.log(a);//[1, 8, 88, 888, 2, 3, 4, 5]
  • 常用操作

join(char)
這個方法在C#等語言中也有,作用是把數(shù)組元素(對象調(diào)用其toString()方法)使用參數(shù)作為連接符連接成一字符串讯檐,不會修改原數(shù)組內(nèi)容

var a = [1,2,3,4,5];
console.log(a.join(',')); //1,2,3,4,5
console.log(a.join(' ')); //1 2 3 4 5

slice(start,end)
slice方法用于返回數(shù)組中一個片段或子數(shù)組羡疗,如果只寫一個參數(shù)返回參數(shù)到數(shù)組結(jié)束部分,如果參數(shù)出現(xiàn)負(fù)數(shù)别洪,則從數(shù)組尾部計數(shù)(-3意思是數(shù)組倒第三個)叨恨,如果start大于end返回空數(shù)組。
slice不會改變原數(shù)組挖垛,而是返回一個新的數(shù)組痒钝。

var a = [1,2,3,4,5];
console.log(a); //[1, 2, 3, 4, 5]
console.log(a.slice(1,2));//2
console.log(a.slice(1,-1));//[2, 3, 4]
console.log(a.slice(3,2));//[]
console.log(a); //[1, 2, 3, 4, 5]

concat(array)
concat方法用于拼接數(shù)組秉颗,a.concat(b)返回一個a和b共同組成的新數(shù)組,同樣不會修改任何一個原始數(shù)組午乓,也不會遞歸連接數(shù)組內(nèi)部數(shù)組

var a = [1,2,3,4,5];
var b = [6,7,8,9];
console.log(a.concat(b));//[1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log(a); //[1, 2, 3, 4, 5]
console.log(b); //[6, 7, 8, 9]

reverse()
方法用于將數(shù)組逆序站宗,與之前不同的是它會修改原數(shù)組

var a = [1,2,3,4,5];
a.reverse();
console.log(a); //[5, 4, 3, 2, 1]

sort
sort方法用于對數(shù)組進(jìn)行排序闸准,當(dāng)沒有參數(shù)的時候會按字母表升序排序益愈,如果含有undefined會被排到最后面,對象元素則會調(diào)用其toString方法夷家,如果想按照自己定義方式排序蒸其,可以傳一個排序方法進(jìn)去,很典型的策略模式库快,同樣sort會改變原數(shù)組摸袁。

var a=[5,4,3,2,1];
a.sort();
console.log(a);//[1, 2, 3, 4, 5]

但如果出現(xiàn)10、11等以1開頭的多位數(shù)會排序出錯义屏,所以我們可以傳入自定義排序函數(shù)

var a = [7,8,9,10,11];

a.sort(function(v1,v2){
    return v1-v2;
});
console.log(a);//[7, 8, 9, 10, 11]

sort內(nèi)部使用快速排序靠汁,每次比較兩個元素大小的時候如果沒有參數(shù),則直接判斷字母表闽铐,如果有參數(shù)蝶怔,則把正在比較的兩個參數(shù)傳入自定義方法并調(diào)用(正在比較的兩個數(shù)會傳給自定義方法的v1、v2)兄墅,如果返回值大于0表示v1 > v2踢星,如果等于0,表示v1 = v2隙咸,如果小于0沐悦,表示v1 < v2,其實(shí)我們傳入的方法就是告訴sort怎么比較兩個元素誰大誰小

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末五督,一起剝皮案震驚了整個濱河市藏否,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌充包,老刑警劉巖副签,帶你破解...
    沈念sama閱讀 218,858評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異误证,居然都是意外死亡继薛,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,372評論 3 395
  • 文/潘曉璐 我一進(jìn)店門愈捅,熙熙樓的掌柜王于貴愁眉苦臉地迎上來遏考,“玉大人,你說我怎么就攤上這事蓝谨」嗑撸” “怎么了青团?”我有些...
    開封第一講書人閱讀 165,282評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長咖楣。 經(jīng)常有香客問我督笆,道長,這世上最難降的妖魔是什么诱贿? 我笑而不...
    開封第一講書人閱讀 58,842評論 1 295
  • 正文 為了忘掉前任娃肿,我火速辦了婚禮,結(jié)果婚禮上珠十,老公的妹妹穿的比我還像新娘料扰。我一直安慰自己,他們只是感情好焙蹭,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,857評論 6 392
  • 文/花漫 我一把揭開白布晒杈。 她就那樣靜靜地躺著,像睡著了一般孔厉。 火紅的嫁衣襯著肌膚如雪拯钻。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,679評論 1 305
  • 那天撰豺,我揣著相機(jī)與錄音粪般,去河邊找鬼。 笑死郑趁,一個胖子當(dāng)著我的面吹牛刊驴,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播寡润,決...
    沈念sama閱讀 40,406評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼捆憎,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了梭纹?” 一聲冷哼從身側(cè)響起躲惰,我...
    開封第一講書人閱讀 39,311評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎变抽,沒想到半個月后础拨,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,767評論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡绍载,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,945評論 3 336
  • 正文 我和宋清朗相戀三年诡宗,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片击儡。...
    茶點(diǎn)故事閱讀 40,090評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡塔沃,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出阳谍,到底是詐尸還是另有隱情蛀柴,我是刑警寧澤螃概,帶...
    沈念sama閱讀 35,785評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站鸽疾,受9級特大地震影響吊洼,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜制肮,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,420評論 3 331
  • 文/蒙蒙 一冒窍、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧弄企,春花似錦超燃、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,988評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽樱调。三九已至约素,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間笆凌,已是汗流浹背圣猎。 一陣腳步聲響...
    開封第一講書人閱讀 33,101評論 1 271
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留乞而,地道東北人送悔。 一個月前我還...
    沈念sama閱讀 48,298評論 3 372
  • 正文 我出身青樓,卻偏偏與公主長得像爪模,于是被迫代替她去往敵國和親欠啤。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,033評論 2 355

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

  • 基礎(chǔ)儲備 數(shù)組的本質(zhì)就是一種特殊的對象屋灌,使用typeof可以返回數(shù)組的類型是Object洁段,然后數(shù)組的特殊性在于他的...
    6J閱讀 351評論 1 1
  • 數(shù)組是值的有序集合。每個值叫做一個元素共郭,而每個元素在數(shù)組中有一個位置祠丝,以數(shù)字表示,稱為索引除嘹。 JavaScript...
    劼哥stone閱讀 1,130評論 6 20
  • 最近天氣溫度步步高攀写半,各種事情七攪八纏,自己頭暈?zāi)X脹尉咕,幾天已經(jīng)沒有看書沒有寫文章沒有跑步?jīng)]有做自己的計劃的事情了叠蝇。...
    冰藍(lán)色的太陽閱讀 146評論 0 0
  • 昨晚的消息突然稱今天上學(xué)的前兩節(jié)不用上,今天又是迎新的第二天龙考,早早的宿舍兩個部長就起來了蟆肆,本來準(zhǔn)備偷偷懶矾睦,今天晚起...
    水墨斯人閱讀 178評論 0 0
  • 提及興全基金,大家會條件性的想到什么炎功? 一家基金經(jīng)理兩度喊話讓基民贖回的“良心基金公司”枚冗? 還是說一家精品化口碑的...
    基爾摩斯閱讀 2,425評論 0 0