JavaScript中數(shù)組的基本方法詳解

JS中的內(nèi)置對(duì)象有:String酌心,Array赫舒,Math,Date东且。今天我們來詳解一下數(shù)組的創(chuàng)建及其方法。

數(shù)組的創(chuàng)建:

①使用數(shù)組構(gòu)造函數(shù):?var?arr?=?new?Array();?

在這里需要說明的是()中可以是預(yù)先知道數(shù)組要保存的項(xiàng)目數(shù)量;也可以向Array構(gòu)造函數(shù)中傳遞數(shù)組應(yīng)包含的項(xiàng)本讥。

②使用數(shù)組字面量表示方法:var?arr?=?[1,2,3];??

Array的棧方法:

①push()

語法:arr.push();

功能:把參數(shù)添加到arr的尾部(會(huì)改變?cè)瓟?shù)組)

返回值:把指定的值添加到數(shù)組后的新長(zhǎng)度

②unshift()

語法:arr.unshift();

功能:把參數(shù)添加到arr的開頭(會(huì)改變?cè)瓟?shù)組)

返回值:把指定的值添加到數(shù)組后的新長(zhǎng)度

③pop()

語法:arr.pop();

功能:刪除arr的最后一個(gè)元素珊泳,如果數(shù)組已經(jīng)為空則不改變數(shù)組,并返回 undefined 值(會(huì)改變?cè)瓟?shù)組)

返回值:被刪除的元素

④shift()

語法:arr.shift();

功能:刪除arr的第一個(gè)元素拷沸,如果數(shù)組為空色查,shift() 方法將不進(jìn)行任何操作,如果是一個(gè)空數(shù)組撞芍,返回undefined(會(huì)改變?cè)瓟?shù)組)

返回值:被刪除的元素

Array的轉(zhuǎn)換方法:join()

語法:arr.join();

功能:把a(bǔ)rr中所有元素放入字符串(不會(huì)改變?cè)瓟?shù)組)

返回值:字符串

Array的重排序方法

①reverse()

語法:arr.reverse();

功能:顛倒數(shù)組中元素的順序(會(huì)改變?cè)瓟?shù)組)

返回值:顛倒順序后的數(shù)組

②sort()

語法:arr.sort();

功能:對(duì)數(shù)組進(jìn)行排序(會(huì)改變?cè)瓟?shù)組)

返回值:重新排序后的數(shù)組

我們來看一個(gè)例子:

var?arr?=?[24,12,13,88,9];???

var?newArr?=?arr.sort();???

console.log(newArr);

大家認(rèn)為打印的出來應(yīng)該是9,12,13,24,88才對(duì)吧综慎,可是結(jié)果呢

我們會(huì)發(fā)現(xiàn)9明明是最小的,但是卻排在了最后面勤庐,這是因?yàn)閟ort()其實(shí)是把每個(gè)一個(gè)數(shù)組項(xiàng)都調(diào)用了toString()方法示惊,先將數(shù)組項(xiàng)轉(zhuǎn)成字符串,再按字符串來排序愉镰,所以“9”就成為了最大的米罚。

如果我們希望按照數(shù)字大小來排序的話,可以給sort()傳入比較函數(shù)作為參數(shù)丈探。

從小到大排序:arr.sort(function(a录择,b){return a-b ;}) ;

從大到小排序:arr.sort(function(a,b){return b-a;});

這個(gè)時(shí)候我們?cè)賹?shù)組排序就會(huì)出現(xiàn)我們想要的結(jié)果碗降。

var?arr?=?[24,12,13,88,9];???

var?newArr?=?arr.sort(function(a隘竭,b){return?a-b;});???

console.log(newArr);?

如果你想從大到小排序只需要將比較函數(shù)中的返回值改一下就OK了。

Array中的連接方法:concat()

語法:arr.concat();

功能:用于連接兩個(gè)或多個(gè)數(shù)組(不會(huì)改變?cè)瓟?shù)組)

返回值:連接后的數(shù)組

Array中的截取方法:slice()

語法:arr.slice(start讼渊,end);

功能:從已有的數(shù)組中返回選定的元素(不會(huì)改變?cè)瓟?shù)組)

返回值:數(shù)組

參數(shù)說明:①start和end是數(shù)組中的索引动看,即整數(shù);

②start是必需的,規(guī)定了從何處開始選取;

③end是可選的爪幻,規(guī)定了從何處結(jié)束選取菱皆,如果沒有指定end時(shí)须误,截取的數(shù)組包含從start開始到數(shù)組結(jié)束的所有元素;

④?截取范圍是start到end-1的元素,end不包含在截取范圍內(nèi);

⑤slice()的參數(shù)中有負(fù)數(shù)仇轻,則用數(shù)組長(zhǎng)度加上該數(shù)來確定相應(yīng)的位置京痢。

Array中的splice方法:可以實(shí)現(xiàn)刪除,插入篷店,替換功能

刪除功能

語法:arr.splice(index祭椰,count);

功能:刪除從index開始的count個(gè)元素(會(huì)改變?cè)瓟?shù)組)

返回值:含有被刪除元素的數(shù)組

參數(shù)說明:①index是開始刪除的元素的索引;

②count是刪除的項(xiàng)目數(shù)疲陕,如果為0吭产,則不會(huì)刪除;如果不設(shè)置,則刪除從index開始的所有數(shù)組項(xiàng)鸭轮。

插入功能

語法:arr.splice(index臣淤,0,item1..... itemx);

功能:在指定位置前插入指定內(nèi)容

返回值:空數(shù)組

參數(shù)說明:①index是起始位置的索引;

②0是要?jiǎng)h除的項(xiàng)數(shù)(因?yàn)椴迦氩恍枰獎(jiǎng)h除數(shù)組項(xiàng)窃爷,所以是0);

③item1... itemx是要插入的內(nèi)容邑蒋。

替換功能

語法:arr.splice(index,count按厘,item1..... itemx);

功能:在指定位置前插入指定內(nèi)容医吊,同時(shí)刪除任意數(shù)量的項(xiàng)

返回值:從原始數(shù)組中刪除的項(xiàng)(如果沒有刪除任何項(xiàng),則返回空數(shù)組)

參數(shù)說明:①index是起始位置的索引;

②count是要?jiǎng)h除的項(xiàng)數(shù);

③item1... itemx是插入的內(nèi)容逮京。

ECMAScript中為數(shù)組實(shí)例添加了兩個(gè)位置方法:indexOf和lastIndexOf

① indexOf()

語法:arr.indexOf(searchValue卿堂,startIndex);

功能:從數(shù)組的開頭開始向后查找(不會(huì)改變?cè)瓟?shù)組)

返回值:查找的項(xiàng)在數(shù)組中的位置,沒有找到的情況下返回-1

②lastIndexOf()

語法:arr.lastIndexOf(searchValue懒棉,startIndex);

功能:從數(shù)組的末尾開始查找(不會(huì)改變?cè)瓟?shù)組)

返回值:查找的項(xiàng)在數(shù)組中的位置草描,沒有找到的情況下返回-1

說明:①這兩個(gè)方法在比較第一個(gè)參數(shù)與數(shù)組中的每一項(xiàng)時(shí),將使用===操作符策严,即要求查找的項(xiàng)必須嚴(yán)格相等;

②兼容性問題穗慕,支持的瀏覽器有:IE9 +,F(xiàn)ireFox2 +妻导,Chrome逛绵,Safari3。

ECMAScript 6為數(shù)組增添的新方法:map()倔韭,reduce()术浪,filter()

①map()

語法:arr.map(函數(shù));

功能:相當(dāng)于讓arr的每個(gè)數(shù)據(jù)執(zhí)行了一次()中的方法,(不會(huì)改變?cè)瓟?shù)組)例:

function add(a){

??? return? b =a*a;

}

var arr = [1,2,3,4];

var newArr =?arr.map(add);

console.log( newArr);

②reduce()

語法:arr.reduce(函數(shù));

功能:把一個(gè)函數(shù)作用在arr的每一個(gè)元素上寿酌,它必須接收兩個(gè)參數(shù)胰苏,reduce()把結(jié)果繼續(xù)和序列的下一個(gè)元素做累積計(jì)算。例:要把[1,2,3,4,5,6]變換成整數(shù)123456份名,就可以用reduce()做到

function changeNumber(x,y){

????? return? x * 10 + y;

?}

var arr = [1,2,3,4,5,6];

var newArr = arr.reduce(changeNumber);

console.log(newArr);

③filter()

語法:arr.filter(函數(shù));

功能:用于把Array的某些元素過濾掉碟联,然后返回剩下的元素妓美,和map()類似僵腺,Array的filter()也接收一個(gè)函數(shù)鲤孵。和map()不同的是,filter()把傳入的函數(shù)依次作用于每個(gè)元素辰如,然后根據(jù)返回值是true還是false決定保留還是丟棄該元素普监。例:利用filter()刪除數(shù)組中的偶數(shù)項(xiàng)

function deleteOushu(x){

???? return x % 2 !== 0;

}

var arr = [1,2,3,4,5,6,7,8,9,10];

var newArr = arr.filter(deleteOushu);

console.log(newArr);


filter()接受的回調(diào)函數(shù)可以有多個(gè)參數(shù),第一個(gè)參數(shù)表示arr的某個(gè)元素琉兜,第二個(gè)參數(shù)表示元素在arr中的位置凯正,第三個(gè)參數(shù)表示數(shù)組本身:

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

var newArr = arr.filter(function(element,index,self){

??? console.log(element);???? //依次打印"a","b","c"

???? console.log(index);??????? //依次打印0,1,2

???? console.log(self);??????? ?? //打印arr本身

????? return true;

})

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末豌蟋,一起剝皮案震驚了整個(gè)濱河市廊散,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌梧疲,老刑警劉巖允睹,帶你破解...
    沈念sama閱讀 211,042評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異幌氮,居然都是意外死亡缭受,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,996評(píng)論 2 384
  • 文/潘曉璐 我一進(jìn)店門该互,熙熙樓的掌柜王于貴愁眉苦臉地迎上來米者,“玉大人,你說我怎么就攤上這事宇智÷悖” “怎么了?”我有些...
    開封第一講書人閱讀 156,674評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵随橘,是天一觀的道長(zhǎng)败明。 經(jīng)常有香客問我,道長(zhǎng)太防,這世上最難降的妖魔是什么妻顶? 我笑而不...
    開封第一講書人閱讀 56,340評(píng)論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮蜒车,結(jié)果婚禮上讳嘱,老公的妹妹穿的比我還像新娘。我一直安慰自己酿愧,他們只是感情好沥潭,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,404評(píng)論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著嬉挡,像睡著了一般钝鸽。 火紅的嫁衣襯著肌膚如雪汇恤。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,749評(píng)論 1 289
  • 那天拔恰,我揣著相機(jī)與錄音因谎,去河邊找鬼。 笑死颜懊,一個(gè)胖子當(dāng)著我的面吹牛财岔,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播河爹,決...
    沈念sama閱讀 38,902評(píng)論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼匠璧,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了咸这?” 一聲冷哼從身側(cè)響起夷恍,我...
    開封第一講書人閱讀 37,662評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎媳维,沒想到半個(gè)月后酿雪,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,110評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡侨艾,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,451評(píng)論 2 325
  • 正文 我和宋清朗相戀三年执虹,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片唠梨。...
    茶點(diǎn)故事閱讀 38,577評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡袋励,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出当叭,到底是詐尸還是另有隱情茬故,我是刑警寧澤,帶...
    沈念sama閱讀 34,258評(píng)論 4 328
  • 正文 年R本政府宣布蚁鳖,位于F島的核電站磺芭,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏醉箕。R本人自食惡果不足惜钾腺,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,848評(píng)論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望讥裤。 院中可真熱鬧放棒,春花似錦、人聲如沸己英。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,726評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至厢破,卻和暖如春荣瑟,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背摩泪。 一陣腳步聲響...
    開封第一講書人閱讀 31,952評(píng)論 1 264
  • 我被黑心中介騙來泰國(guó)打工笆焰, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人加勤。 一個(gè)月前我還...
    沈念sama閱讀 46,271評(píng)論 2 360
  • 正文 我出身青樓仙辟,卻偏偏與公主長(zhǎng)得像同波,于是被迫代替她去往敵國(guó)和親鳄梅。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,452評(píng)論 2 348

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