Js數(shù)組常用方法

//JS數(shù)組常用方法及其應(yīng)用

/**

* 1.push(): 向數(shù)組尾部添加一個(gè)或多個(gè)元素钞馁,并返回添加新元素后的數(shù)組長(zhǎng)度虑省。注意,該方法會(huì)改變?cè)瓟?shù)組僧凰。

* pop(): 刪除數(shù)組的最后一個(gè)元素探颈,并返回該元素。注意训措,該方法會(huì)改變?cè)瓟?shù)組伪节。

*/

let arr1 = ["a","b","c"];

console.log("arr1:" + arr1);

arr1.push("d");

console.log("arr1:" + arr1);

let t = arr1.pop();

console.log("arr1.pop():" + t);

console.log("arr1:" + arr1);

輸出:

arr1:a,b,c

arr1:a,b,c,d

arr1.pop():d

arr1:a,b,c

/**

* 2.unshift():在數(shù)組的第一個(gè)位置添加元素光羞,并返回添加新元素后的數(shù)組長(zhǎng)度。注意怀大,該方法會(huì)改變?cè)瓟?shù)組纱兑。

* shift():刪除數(shù)組的第一個(gè)元素,并返回該元素化借。注意潜慎,該方法會(huì)改變?cè)瓟?shù)組。

*/

let arr1 = ["a","b","c"];

console.log("arr1:" + arr1);

arr1.unshift("d");

console.log("arr1:" + arr1);

arr1.shift();

console.log("arr1:" + arr1);

輸出:

arr1:a,b,c

arr1:d,a,b,c

arr1:a,b,c

利用shift和pop方法可以分別正序逆序輸出數(shù)組值屏鳍,但是遍歷之后原數(shù)組中的數(shù)據(jù)被清空了:

let elem;

while (elem = arr1.shift()) {

? ? console.log(elem);

}

while (elem = arr1.pop()) {

? ? console.log(elem);

}

/**

* 3.indexOf():返回指定元素在數(shù)組中出現(xiàn)的位置,如果沒有出現(xiàn)則返回-1局服。indexOf方法還可以接受第二個(gè)參數(shù)钓瞭,表示搜索的開始位置。

*/

let arr1 = ["a","b","c"];

console.log("arr1:" + arr1.indexOf("a"));

console.log("arr1:" + arr1.indexOf("d"));

console.log("arr1:" + arr1.indexOf("a",1));

輸出:

arr1:0

arr1:-1

arr1:-1

利用indexof可以遍歷數(shù)組淫奔,做數(shù)值的比較操作:

function topicsCompare( topics1, topics2, cb ){

? ? let add = [];

? ? let remove = [];

? ? for (let key in topics1) {

? ? ? ? let top1 = topics1[key];

? ? ? ? // console.log("top1"+top1);

? ? ? ? if( topics2.indexOf(top1) === (-1) ){

? ? ? ? ? ? //輸出topics1中存在山涡,topics2中不存在的數(shù)據(jù)

? ? ? ? ? ? console.log("---"+top1);

? ? ? ? ? ? remove.push(top1);

? ? ? ? }

? ? }

? ? for (let key in topics2) {

? ? ? ? let top2 = topics2[key];

? ? ? ? // console.log("top2"+top2);

? ? ? ? if( topics1.indexOf(top2) === (-1) ){

? ? ? ? ? ? ?//輸出topics2中存在,topics1中不存在的數(shù)據(jù)

? ? ? ? ? ? console.log("+++"+top2);

? ? ? ? ? ? add.push(top2);

? ? ? ? }

? ? }

? ? return cb(add,remove);

}

/**

* 4.join():以參數(shù)作為分隔符唆迁,將所有數(shù)組成員組成一個(gè)字符串返回鸭丛。如果不提供參數(shù),默認(rèn)用逗號(hào)分隔唐责。

*/

let arr1 = ["a","b","c"];

console.log("arr1:" + arr1);

console.log("arr1:" + arr1.join());

console.log("arr1:" + arr1.join(" "));

console.log("arr1:" + arr1.join("|"));

console.log("arr1:" + arr1.join("*"));

輸出:

arr1:a,b,c

arr1:a,b,c

arr1:a b c

arr1:a|b|c

arr1:a*b*c

/**

* 5.concat():用于多個(gè)數(shù)組的合并鳞溉。它將新數(shù)組的成員,添加到原數(shù)組的尾部鼠哥,然后返回一個(gè)新數(shù)組熟菲,原數(shù)組不變。

*/

let arr1 = ["a","b","c"];

let arr2 = ["d","e"];

console.log("arr1:" + arr1);

console.log("arr1:" + arr1.concat(arr2));

輸出:

arr1:a,b,c

arr1:a,b,c,d,e

/**

* 6.reverse():用于顛倒數(shù)組中元素的順序朴恳,返回改變后的數(shù)組抄罕。注意,該方法將改變?cè)瓟?shù)組于颖。

*/

let arr1 = ["a","b","c"];

console.log("arr1:" + arr1);

console.log("arr1:" + arr1.reverse());

輸出:

arr1:a,b,c

arr1:c,b,a

/**

* 7.slice():用于截取原數(shù)組的一部分,返回一個(gè)新數(shù)組森渐,原數(shù)組不變做入。

* slice(start,end)它的第一個(gè)參數(shù)為起始位置(從0開始)同衣,第二個(gè)參數(shù)為終止位置(但該位置的元素本身不包括在內(nèi))母蛛。如果省略第二個(gè)參數(shù),則一直返回到原數(shù)組的最后一個(gè)成員乳怎。

*/

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

console.log("arr1:" + arr.slice(0));? ? ? ? // ["a", "b", "c"]

console.log("arr1:" + arr.slice(1));? ? ? ? // ["b", "c"]

console.log("arr1:" + arr.slice(1, 2));? ? // ["b"]

console.log("arr1:" + arr.slice(2, 6));? ? // ["c"]

console.log("arr1:" + arr.slice());? ? ? ? ? // ["a", "b", "c"]? ? 無參數(shù)返回原數(shù)組

console.log("arr1:" + arr.slice(-2));? ? ? ? ? // ["b", "c"]? ? 參數(shù)是負(fù)數(shù)彩郊,則表示倒數(shù)計(jì)算的位置

console.log("arr1:" + arr.slice(-2, -1));? ? // ["b"]

輸出:

arr1:a,b,c

arr1:b,c

arr1:b

arr1:c

arr1:a,b,c

arr1:b,c

arr1:b

/**

* 8.splice():刪除原數(shù)組的一部分成員前弯,并可以在被刪除的位置添加入新的數(shù)組成員,返回值是被刪除的元素秫逝。注意恕出,該方法會(huì)改變?cè)瓟?shù)組。

* splice(start,delNum,addElement1,addElement2,...)第一個(gè)參數(shù)是刪除的起始位置违帆,第二個(gè)參數(shù)是被刪除的元素個(gè)數(shù)浙巫。如果后面還有更多的參數(shù),則表示這些就是要被插入數(shù)組的新元素刷后。

*/

let arr1 = ["a","b","c","d","e","f"];

let arr2 = ["1","2","3"];

console.log("arr1:" + arr1);

console.log("arr1:" + arr1.splice(4, 2));

console.log("arr1:" + arr1);

console.log("arr1:" + arr1.splice(4, 2, arr2));

console.log("arr1:"+ arr1);

console.log("arr1:" + arr1.splice(-4, 2));//起始位置如果是負(fù)數(shù)的畴,就表示從倒數(shù)位置開始刪除

console.log("arr1:"+ arr1);

console.log("arr1:" + arr1.splice(2, 0, "c", "d", "e", "f"));//如果只插入元素,第二個(gè)參數(shù)可以設(shè)為0,此處表示從第二個(gè)位置后面開始插入

console.log("arr1:"+ arr1);

console.log("arr1:" + arr1.splice(4));//如果只有第一個(gè)參數(shù),等同于將原數(shù)組在指定位置拆分成兩個(gè)數(shù)組

console.log("arr1:"+ arr1);//此處表示從第4個(gè)位置開始

輸出:

arr1:a,b,c,d,e,f

arr1:e,f

arr1:a,b,c,d

arr1:

arr1:a,b,c,d,1,2,3

arr1:b,c

arr1:a,d,1,2,3

arr1:

arr1:a,d,c,d,e,f,1,2,3

arr1:e,f,1,2,3

arr1:a,d,c,d

/**

* 9.sort():對(duì)數(shù)組成員進(jìn)行排序尝胆,默認(rèn)是按照字典順序排序丧裁。排序后,原數(shù)組將被改變含衔。

* sort方法不是按照大小排序煎娇,而是按照對(duì)應(yīng)字符串的字典順序排序。也就是說贪染,數(shù)值會(huì)被先轉(zhuǎn)成字符串缓呛,再按照字典順序進(jìn)行比較,所以101排在11的前面杭隙。

*/

let arr1 = ["a","b","e","f","c","d"];

let arr2 = [1,2,9,3,4,5];

let arr3 = [111, 1101, 10111];

console.log("arr1:" + arr1.sort());

console.log("arr1:" + arr2.sort());

console.log("arr1:" + arr3.sort());

輸出:

arr1:a,b,c,d,e,f

arr1:1,2,3,4,5,9

arr1:10111,1101,111

如果想讓sort方法按照自定義方式排序哟绊,可以傳入一個(gè)函數(shù)作為參數(shù),表示按照自定義方法進(jìn)行排序痰憎。該函數(shù)本身又接受兩個(gè)參數(shù)匿情,表示進(jìn)行比較的兩個(gè)元素。

如果返回值大于0信殊,表示第一個(gè)元素排在第二個(gè)元素后面炬称;其他情況下,都是第一個(gè)元素排在第二個(gè)元素前面涡拘。

let arr1 = [10111, 1101, 111];

let arr2 = [

? ? { name: "張三", age: 30 },

? ? { name: "李四", age: 24 },

? ? { name: "王五", age: 28 }

]

arr1.sort(function (a, b) {

? return a - b;

})

arr2.sort(function (o1, o2) {

? return o1.age - o2.age;

})

console.log("arr1:" + arr1);

console.log(arr2);

輸出:

arr1:111,1101,10111

[ { name: '李四', age: 24 },

? { name: '王五', age: 28 },

? { name: '張三', age: 30 } ]

/**

* 10.map():對(duì)數(shù)組的所有成員依次調(diào)用一個(gè)函數(shù)玲躯,根據(jù)函數(shù)結(jié)果返回一個(gè)新數(shù)組。

*/

let arr1 = [1, 2, 3];

let arr2 = arr1.map(function (n) {

? return n + "s";

});

console.log("arr1:" + arr1);

console.log("arr1:" + arr2);

輸出:

arr1:1,2,3

arr1:1s,2s,3s

/**

* 11.filter():參數(shù)是一個(gè)函數(shù)鳄乏,所有數(shù)組成員依次執(zhí)行該函數(shù)跷车,返回結(jié)果為true的成員組成一個(gè)新數(shù)組返回。該方法不會(huì)改變?cè)瓟?shù)組橱野。

*對(duì)比filter與map的輸出區(qū)別

*/

let arr1 = [1, 2, 3, 4, 5];

let arr2 = arr1.map(function (n) {

? return n>2;

});

let arr3 = arr1.filter(function (n){

? ? return n>2;

});

console.log("arr1:" + arr1);

console.log("arr1:" + arr2);

console.log("arr1:" + arr3);

輸出:

arr1:1,2,3,4,5

arr1:false,false,true,true,true

arr1:3,4,5

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末朽缴,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子水援,更是在濱河造成了極大的恐慌密强,老刑警劉巖茅郎,帶你破解...
    沈念sama閱讀 217,907評(píng)論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異或渤,居然都是意外死亡系冗,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,987評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門薪鹦,熙熙樓的掌柜王于貴愁眉苦臉地迎上來掌敬,“玉大人,你說我怎么就攤上這事池磁”己Γ” “怎么了?”我有些...
    開封第一講書人閱讀 164,298評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵地熄,是天一觀的道長(zhǎng)华临。 經(jīng)常有香客問我,道長(zhǎng)离斩,這世上最難降的妖魔是什么银舱? 我笑而不...
    開封第一講書人閱讀 58,586評(píng)論 1 293
  • 正文 為了忘掉前任瘪匿,我火速辦了婚禮跛梗,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘棋弥。我一直安慰自己核偿,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,633評(píng)論 6 392
  • 文/花漫 我一把揭開白布顽染。 她就那樣靜靜地躺著漾岳,像睡著了一般。 火紅的嫁衣襯著肌膚如雪粉寞。 梳的紋絲不亂的頭發(fā)上尼荆,一...
    開封第一講書人閱讀 51,488評(píng)論 1 302
  • 那天,我揣著相機(jī)與錄音唧垦,去河邊找鬼捅儒。 笑死,一個(gè)胖子當(dāng)著我的面吹牛振亮,可吹牛的內(nèi)容都是我干的巧还。 我是一名探鬼主播,決...
    沈念sama閱讀 40,275評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼坊秸,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼麸祷!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起褒搔,我...
    開封第一講書人閱讀 39,176評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤阶牍,失蹤者是張志新(化名)和其女友劉穎喷面,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體荸恕,經(jīng)...
    沈念sama閱讀 45,619評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡乖酬,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,819評(píng)論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了融求。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片咬像。...
    茶點(diǎn)故事閱讀 39,932評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖生宛,靈堂內(nèi)的尸體忽然破棺而出县昂,到底是詐尸還是另有隱情,我是刑警寧澤陷舅,帶...
    沈念sama閱讀 35,655評(píng)論 5 346
  • 正文 年R本政府宣布倒彰,位于F島的核電站,受9級(jí)特大地震影響莱睁,放射性物質(zhì)發(fā)生泄漏待讳。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,265評(píng)論 3 329
  • 文/蒙蒙 一仰剿、第九天 我趴在偏房一處隱蔽的房頂上張望创淡。 院中可真熱鬧,春花似錦南吮、人聲如沸琳彩。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,871評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽露乏。三九已至,卻和暖如春涂邀,著一層夾襖步出監(jiān)牢的瞬間瘟仿,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,994評(píng)論 1 269
  • 我被黑心中介騙來泰國(guó)打工比勉, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留劳较,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,095評(píng)論 3 370
  • 正文 我出身青樓敷搪,卻偏偏與公主長(zhǎng)得像兴想,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子赡勘,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,884評(píng)論 2 354

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

  • 1嫂便、新的聲明方式 以前我們?cè)诼暶鲿r(shí)只有一種方法,就是使用var來進(jìn)行聲明闸与,ES6對(duì)聲明的進(jìn)行了擴(kuò)展毙替,現(xiàn)在可以有三種...
    令武閱讀 1,009評(píng)論 0 7
  • 由于最近都在freecodecamp上刷代碼岸售,運(yùn)用了很多JavaScript數(shù)組的方法,因此做了一份關(guān)于JavaS...
    2bc5f46e925b閱讀 1,976評(píng)論 0 16
  • 添加(返回新的數(shù)組長(zhǎng)度) 末尾添加 arr.push(els) 開頭添加 arr.unshift(els) 刪除(...
    追卓2018閱讀 435評(píng)論 0 0
  • 1厂画、使用typeof bar ===“object”來確定bar是否是一個(gè)對(duì)象時(shí)有什么潛在的缺陷凸丸?這個(gè)陷阱如何避免...
    深海鯽魚堡閱讀 661評(píng)論 1 1
  • 如果一時(shí)半會(huì)不知道做什么項(xiàng)目屎慢, 可以發(fā)現(xiàn)身邊熱的項(xiàng)目, 或者一些可以給你靈感的項(xiàng)目忽洛! 嘗試問自己腻惠,如果讓你做,你能...
    烏龜?shù)穆?/span>閱讀 258評(píng)論 0 0