數(shù)組常用的15個(gè)方法
學(xué)習(xí)數(shù)組中的常用方法我們需要從四個(gè)方面去探討
- 方法的作用
- 需要傳哪些參數(shù)<
- 是否有返回值狐胎，返回值是什么
- 通過(guò)此方法是否對(duì)原有數(shù)組產(chǎn)生了改變
1. ary.push()方法 向數(shù)組的末尾增加新的內(nèi)容
var ary = [11,12,13，14];
var res = ary.push(100贤旷，“ok”);
console.log(res,ary);
結(jié)果為 6 [11, 12, 13, 14, 100, "ok"]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->想增加什么就傳遞什么砍濒，而且可以傳遞多個(gè)值茧彤。 返回值->新數(shù)組的長(zhǎng)度狮鸭。對(duì)原有數(shù)組->產(chǎn)生了改變
此方法的拓展 ary.length新增一項(xiàng)
var ary = [11,12,13,14];
res = ary[ary.length] = 101;
console.log(res,ary);
結(jié)果為 101 [11, 12, 13, 14, 101]
> 用arylength也可達(dá)到其差不多的目的
2. ary.pop()方法 刪除數(shù)組中的最后一項(xiàng)
var ary = [11,12,13,14];
var res = ary.pop();
console.log(res,ary);
結(jié)果為 14 [11, 12, 13]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->無(wú)饰剥。 返回值->數(shù)組中被刪除的那一項(xiàng)忠荞。對(duì)原有數(shù)組->產(chǎn)生了改變
此方法的拓展 ary.length--刪除數(shù)組最后一項(xiàng)
var ary = [11,12,13,14];
ary.length--;
console.log(ary);
結(jié)果為 [11, 12, 13]
用arylength--也可達(dá)到其差不多的目的
3. ary.shift()方法 刪除數(shù)組中的第一項(xiàng)
var ary = [11,12,13,14];
var res = ary.shift();
console.log(res,ary);
結(jié)果為 11 [12, 13, 14]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->無(wú)蒋歌。 返回值->數(shù)組中被刪除的那一項(xiàng)。對(duì)原有數(shù)組->產(chǎn)生了改變
4. ary.unshift()方法 增加數(shù)組中的第一項(xiàng)
var ary = [11,12,13,14];
var res = ary.unshift(10);
console.log(res,ary);
結(jié)果為 5 [10, 11, 12, 13, 14]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->需要增加什么就傳什么委煤。 返回值->新數(shù)組長(zhǎng)度堂油。對(duì)原有數(shù)組->產(chǎn)生了改變
5. ary.splice()方法(重要的方法)，能實(shí)現(xiàn)增加碧绞，刪除府框，修改->基本方法是刪除，增加和修改是從刪除上引申出來(lái)的
以下為刪除
- ary.aplice(n,m)從索引n開(kāi)始刪除m個(gè)元素讥邻，把刪除的內(nèi)容以一個(gè)新數(shù)組的方式返回即返回值迫靖，原來(lái)的數(shù)組發(fā)生改變
var ary = [11,12,13,14,15,16,17,18];
var res = ary.splice(1,3); //從索引1開(kāi)始即12,刪除3個(gè)，即刪掉了12兴使，13系宜，14
console.log(res,ary);
結(jié)果為 [12, 13, 14] [11, 15, 16, 17, 18]
我們?cè)倏戳硪环N寫(xiě)法
var ary = [11,12,13,14,15,16,17,18];
var res = ary.splice(1); //從索引1開(kāi)始即12,刪除到最后,即刪除掉
了12，13发魄，14盹牧，15俩垃，16，17汰寓，18
console.log(res,ary);
結(jié)果為 [12, 13, 14, 15, 16, 17, 18] [11]
有兩種奇特的寫(xiě)法：
ary.splice(0) //此種寫(xiě)法是刪除掉所有項(xiàng)口柳，原數(shù)組為空，返回值(即新數(shù)組)為原數(shù)
組(即刪除掉的所有項(xiàng))有滑，此種寫(xiě)法用于克隆跃闹，只不過(guò)原有數(shù)組發(fā)生了改變，變?yōu)榱丝諗?shù)組
結(jié)果為[11,12,13,14,15,16,17,18][]
ary.splice() //此種寫(xiě)法是什么也沒(méi)干毛好，什么也沒(méi)有刪除辣卒，返回的是一個(gè)空數(shù)組
結(jié)果為 [] [11,12,13,14,15,16,17,18]
以下為修改
- ary.aplice(n,m，x)從索引n開(kāi)始刪除m個(gè)元素睛榄，用X替換掉刪除的部分荣茫，把刪除的內(nèi)容以一個(gè)新數(shù)組的方式返回即返回值，原來(lái)的數(shù)組發(fā)生改變
var ary = [11,12,13,14,15,16,17,18];
var res = ary.splice(1,3,1000); //從索引1開(kāi)始(12開(kāi)始)场靴，刪除3個(gè)元素(刪除
掉了12啡莉，13，14)旨剥，用1000替換這三項(xiàng)咧欣，把刪除的內(nèi)容即12，13轨帜，14以新數(shù)組的方式返回
(返回值)魄咕，原來(lái)的數(shù)組發(fā)生了改變
console.log(res,ary);
結(jié)果為 [12, 13, 14] [11, 1000, 15, 16, 17, 18]
以下為增加
- ary.splice(n,0,x)從索引開(kāi)始，刪除0個(gè)(一個(gè)都不刪除)蚌父，用x替換掉刪除的部分(沒(méi)有刪除即為增加)哮兰，此處注意( x增加的內(nèi)容是放在了n索引內(nèi)容的前面)返回值為空數(shù)組(因?yàn)橐粋€(gè)都沒(méi)刪除)，原來(lái)的數(shù)組發(fā)生了改變
var ary = [11,12,13,14,15,16,17,18];
var res = ary.splice(1,0,1000);
console.log(res,ary);
結(jié)果為 [] [11, 1000, 12, 13, 14, 15, 16, 17, 18]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->看具體需求兩個(gè)或者三個(gè)參數(shù)苟弛。 返回值->刪除的內(nèi)容喝滞。對(duì)原有數(shù)組->產(chǎn)生了改變
6. ary.slice()方法，能實(shí)現(xiàn)查膏秫，對(duì)數(shù)組的內(nèi)容的查取
- ary.slice(n,m) 從索引n開(kāi)始右遭，查取到索引m(不包含m),返回值(新數(shù)組)為查取的部分，原來(lái)的數(shù)組不變
ar ary = [11,12,13,14,15,16,17,18];
var res = ary.slice(1,4); //從索引1(12)開(kāi)始缤削，查取到索
引4(15),不包含索引4(15),返回值為12,13,14
console.log(res,ary);
結(jié)果為 [12, 13, 14] [11, 12, 13, 14, 15, 16, 17, 18]
> 有兩種奇特的寫(xiě)法：
ary.slice(n) 從索引n開(kāi)始窘哈，查取到數(shù)組末尾<br/>
ary.slice(0)/ary.slice() 從索引0開(kāi)始，查取到數(shù)組末尾亭敢，括號(hào)里可以寫(xiě)0或者什么都不寫(xiě)滚婉，通常用做數(shù)組克隆
var ary = [11,12,13,14,15,16,17,18];
var res = ary.slice(1); //此種寫(xiě)法是從索引1開(kāi)始，查取到數(shù)組末尾吨拗，返回
值(即新數(shù)組)為查取到的數(shù)組
console.log(res,ary);
結(jié)果為[12,13,14,15,16,17,18][11,12,13,14,15,16,17,18]
var ary = [11,12,13,14,15,16,17,18];
var res = ary.slice(); //此種寫(xiě)法是從索引0開(kāi)始满哪，查取到數(shù)組末尾婿斥，返回
值(即新數(shù)組)為原數(shù)組
console.log(res,ary)
結(jié)果為 [11,12,13,14,15,16,17,18] [11,12,13,14,15,16,17,18]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->看具體需求兩個(gè)或者1個(gè)，或者不傳哨鸭。 返回值->查取的內(nèi)容民宿。對(duì)原有數(shù)組->沒(méi)有產(chǎn)生改變
7. ary.concat()方法，把兩個(gè)數(shù)組拼接到一起像鸡，原來(lái)的數(shù)組不變
- var ary3 = ary1.concat(ary2) 數(shù)組1和數(shù)組2進(jìn)行拼接活鹰，形成新數(shù)組3
var ary1 = [1,2,3];
var ary2 = [4,5,6];
var ary3 = ary1.concat(ary2);
console.log(ary3,ary1,ary2);
結(jié)果為 [1, 2, 3, 4, 5, 6] [1, 2, 3] [4, 5, 6]
有一種奇特的寫(xiě)法：
var ary1 = [1,2,3];
var ary2 = [4,5,6];
var ary3 = ary1.concat(); //此處不傳參數(shù)，即什么不和任何數(shù)組拼接只估，
即ary1賦值給ary3,這樣可以克隆
console.log(ary3,ary1,ary2);
結(jié)果為 [1, 2, 3] [1, 2, 3] [4, 5, 6]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->傳遞一個(gè)數(shù)組志群。 返回值->拼接成功的新數(shù)組。對(duì)原有數(shù)組->沒(méi)有產(chǎn)生改變
8. ary.toString()方法蛔钙，把數(shù)組轉(zhuǎn)化為字符串,對(duì)原有數(shù)組不產(chǎn)生改變
var ary = [10,11,12];
var res = ary.toString();
console.log(res,ary);
結(jié)果為 “10,11,12” [10, 11, 12]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->無(wú)锌云。 返回值->轉(zhuǎn)換成的字符串。對(duì)原有數(shù)組->沒(méi)有產(chǎn)生改變
9. ary.join()方法吁脱，按照一個(gè)分隔符桑涎，把數(shù)組中的內(nèi)容用符號(hào)連接，拼接一個(gè)字符串,對(duì)原有數(shù)組不產(chǎn)生改變
var ary = [10,11,12];
var res = ary.join("@");
console.log(res,ary);
結(jié)果為 “10@11@12” [10, 11, 12]
拓展
> 此方法的拓展 eval() eval()把字符串變?yōu)镴S表達(dá)式來(lái)執(zhí)行的一個(gè)方法 ->字符串的方法
例如
console.log(eval("1+2+3"));
結(jié)果為6
通過(guò)以上方法的學(xué)習(xí)兼贡，我們可以做一道題目來(lái)練練手
題：對(duì)數(shù)組進(jìn)行求和攻冷，var ary = [1,2,3,4,5];<br/>
答：
var ary = [1,2,3,4,5];
var val = ary.join("+");//此處變?yōu)橛眉犹?hào)分隔的字符串
var res = eval(val);//將字符串轉(zhuǎn)化為JS表達(dá)式，即可求出和
console.log(val,res,ary);
結(jié)果為 1+2+3+4+5 15 [1, 2, 3, 4, 5] 所以答案為15
- 通過(guò)以上結(jié)果可知：需要傳遞的是->分隔成字符串的東東遍希，不傳默認(rèn)是逗號(hào)等曼。 返回值->轉(zhuǎn)換成的字符串。對(duì)原有數(shù)組->沒(méi)有產(chǎn)生改變
10. ary.reverse()方法凿蒜，將原有數(shù)組禁谦，倒敘排列，對(duì)原有數(shù)組產(chǎn)生影響
var ary = [1,2,3,4,5];
var res = ary.reverse();
console.log(res,ary);
結(jié)果為 [5, 4, 3, 2, 1] [5, 4, 3, 2, 1]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->無(wú)篙程。 返回值->倒敘排列的新數(shù)組枷畏。對(duì)原有數(shù)組->產(chǎn)生改變
11. ary.sort)方法别厘，給數(shù)組進(jìn)行排序(小->大虱饿，大->小),原有的數(shù)組會(huì)發(fā)生改變
- ary,sort();默認(rèn)是處理一位數(shù)，給數(shù)組的第一位進(jìn)行排序 比如18,38,28 排成結(jié)果為18触趴，28氮发，38，只能處理10以?xún)?nèi)的進(jìn)行排序冗懦，按照unicode編碼值進(jìn)行排序的爽冕，因此我們排序一般都是按照以下的例子進(jìn)行排序的
var ary = [34,56,23,19,18,26];
var res = ary.sort(function (n, m) {
return n-m; //從小到大，若從大到小披蕉，后面的減前面的即可
});
console.log(res,ary);
結(jié)果為 [18, 19, 23, 26, 34, 56] [18, 19, 23, 26, 34, 56]
- 通過(guò)以上結(jié)果可知：需要傳遞的是->無(wú)颈畸。 返回值->排完序的新數(shù)組乌奇。對(duì)原有數(shù)組->產(chǎn)生改變
12. ary.indexOf()方法，當(dāng)前元素在數(shù)組中第一次出現(xiàn)的索引眯娱，如果數(shù)組中有這一項(xiàng)礁苗，則返回當(dāng)前位置的索引，如果沒(méi)有則返回-1徙缴，原來(lái)的數(shù)組不變
var ary = [1,2,3,4,5];
var res1 = ary.indexOf(1);
var res2 = ary.indexOf(6);
console.log(res1,res2);
結(jié)果為 0 -1试伙；
> 注意：此方法在標(biāo)準(zhǔn)瀏覽器下才兼容，IE6~8不兼容(字符串中也有此方法于样，但是在字符串中是兼容的)疏叨，同時(shí)，也存在ary.lastIndexOf()這個(gè)方法穿剖，和ary.indexOf一樣蚤蔓，但是該方法是檢測(cè)當(dāng)前元素在數(shù)組中最后一次出現(xiàn)的索引
- 通過(guò)以上結(jié)果可知：需要傳遞的是->需要檢測(cè)的元素。 返回值->當(dāng)前元素的索引或-1糊余。對(duì)原有數(shù)組->不會(huì)產(chǎn)生改變
13. ary.lastIndexOf()方法昌粤，當(dāng)前元素在數(shù)組中最后一次出現(xiàn)的索引，如果數(shù)組中有這一項(xiàng)啄刹，則返回當(dāng)前位置的索引涮坐，如果沒(méi)有則返回-1，原來(lái)的數(shù)組不變
var ary = [1,2,3,4,5,1];
var res1 = ary.lastIndexOf(1);
var res2 = ary.lastIndexOf(6);
console.log(res1,res2);
結(jié)果為 5 -1
>注意：此方法在標(biāo)準(zhǔn)瀏覽器下才兼容誓军，IE6~8不兼容(字符串中也有此方法袱讹，但是在字符串中是兼容的)，
- 通過(guò)以上結(jié)果可知：需要傳遞的是->需要檢測(cè)的元素昵时。 返回值->當(dāng)前元素的索引或-1捷雕。對(duì)原有數(shù)組->不會(huì)產(chǎn)生改變
14. ary.forEach()方法，遍歷數(shù)組中的每一項(xiàng)壹甥，原來(lái)的數(shù)組不變
var ary = [1,2,3,4,5];
var res = ary.forEach(function (item, index, input) {
console.log(item,index,input);
});
console.log(ary);
結(jié)果為
1 0 [1, 2, 3, 4, 5]<br/>
2 1 [1, 2, 3, 4, 5]<br/>
3 2 [1, 2, 3, 4, 5]<br/>
4 3 [1, 2, 3, 4, 5]<br/>
5 4 [1, 2, 3, 4, 5]<br/>
[1, 2, 3, 4, 5]
- 在以上函數(shù)中的參數(shù)救巷，item代表數(shù)組中的每一項(xiàng)，index代表索引值句柠，input代表原數(shù)組浦译，此函數(shù)中，不需要寫(xiě)返回值溯职。除此之外精盅，我們還可以看出該方法執(zhí)行的次數(shù)，和數(shù)組的長(zhǎng)度一樣谜酒，也就是說(shuō)叹俏，數(shù)組有多長(zhǎng)，該方法執(zhí)行幾次
> 注意：此方法在標(biāo)準(zhǔn)瀏覽器下才兼容僻族，IE6~8不兼容
- 通過(guò)以上結(jié)果可知：需要傳遞的是->函數(shù)中傳參粘驰，傳遞參數(shù)的內(nèi)容按照具體需求決定屡谐。 返回值->函數(shù)沒(méi)有返回值。對(duì)原有數(shù)組->不會(huì)產(chǎn)生改變
15. ary.map()方法蝌数，映射數(shù)組中的每一項(xiàng)康嘉，原來(lái)的數(shù)組不變，此方法和forEach的語(yǔ)法是一樣的籽前，但是比f(wàn)orEach()把原來(lái)的內(nèi)容進(jìn)行替換的功能
var ary = [1,2,3,4,5];
var res = ary.map(function (item, index, input) {
return item*10;
});
console.log(res,ary);
結(jié)果為 [10, 20, 30, 40, 50] [1, 2, 3, 4, 5]
> 我們可以從結(jié)果中看出亭珍，map必須有返回值，而且修改了每一項(xiàng)枝哄，因此我們可以總結(jié)肄梨，forEach主要是用來(lái)遍歷每一項(xiàng)，而map是用來(lái)修改每一項(xiàng)的值挠锥。
- 通過(guò)以上結(jié)果可知：需要傳遞的是->函數(shù)中傳參众羡，傳遞參數(shù)的內(nèi)容按照具體需求決定。 返回值->函數(shù)必須有返回值蓖租，也就是說(shuō)必須寫(xiě)return粱侣。對(duì)原有數(shù)組->不會(huì)產(chǎn)生改變
