JavaScript中創(chuàng)建數(shù)組有兩種方式:
(一)使用 Array 構(gòu)造函數(shù):
var arr1 = new Array(); //創(chuàng)建一個(gè)空數(shù)組
var arr2 = new Array(20); // 創(chuàng)建一個(gè)包含20項(xiàng)的數(shù)組
var arr3 = new Array("lily","lucy","Tom"); // 創(chuàng)建一個(gè)包含3個(gè)字符串的數(shù)組
(二)使用數(shù)組字面量表示法:
var arr4 = []; //創(chuàng)建一個(gè)空數(shù)組
var arr5 = [20]; // 創(chuàng)建一個(gè)包含1項(xiàng)的數(shù)組
var arr6 = ["lily","lucy","Tom"]; // 創(chuàng)建一個(gè)包含3個(gè)字符串的數(shù)組
1.push()
push() 向數(shù)組末尾添加一個(gè)或者多個(gè)元素略号,返回新數(shù)組的長度垛膝。 ===》改變?cè)瓟?shù)組
var arr=[1,2];
arr.push(3,5);//4
console.log(arr) //[1,2,3,5]
2.pop()
pop() 刪除數(shù)組最后一項(xiàng)元素,返回刪除的元素梦裂。========》改變?cè)瓟?shù)組
var arr = [1,2,5];
arr.pop(); //5
console.log(arr) //[1,2]
3.unshift()
unshift()向數(shù)組頭部添加一個(gè)或者多個(gè)元素,返回新數(shù)組的長度瓶颠。===》改變?cè)瓟?shù)組
var arr = [1,2,5];
arr.unshift(4,3)//5:返回的值是新數(shù)組的長度
console.log(arr); //[4,3,1,2,5]
4.shift()
shift()刪除數(shù)組第一項(xiàng)元素程腹,返回刪除的元素 ===》改變?cè)瓟?shù)組
var arr = [2,3,5];
arr.shift(); //2
console.log(arr); //[3,5]
5.sort()
sort()對(duì)數(shù)組進(jìn)行排序嚼吞,====》改變?cè)瓟?shù)組
var arr=[1,2,12,3];
arr.sort();//[1,12,2,3]
console.log(arr) //[1,12,2,3]
6.reverse()
reverse()翻轉(zhuǎn)數(shù)組 ===》改變?cè)瓟?shù)組
var arr=[1,2,12,3];
arr.reverse();//[3,12,2,1]
console.log(arr) //[3,12,2,1]
7.splice()
splice() 很強(qiáng)大的數(shù)組方法锰瘸,它有很多種用法刽严,可以實(shí)現(xiàn)刪除、插入和替換避凝。===》改變?cè)瓟?shù)組
刪除:可以刪除任意數(shù)量的項(xiàng)舞萄,只需指定 2 個(gè)參數(shù):要?jiǎng)h除的第一項(xiàng)的位置和要?jiǎng)h除的項(xiàng)數(shù)眨补。例如, splice(0,2)會(huì)刪除數(shù)組中的前兩項(xiàng)倒脓。
插入:可以向指定位置插入任意數(shù)量的項(xiàng)撑螺,只需提供 3 個(gè)參數(shù):起始位置、 0(要?jiǎng)h除的項(xiàng)數(shù))和要插入的項(xiàng)崎弃。例如甘晤,splice(2,0,4,6)會(huì)從當(dāng)前數(shù)組的位置 2 開始插入4和6。
替換:可以向指定位置插入任意數(shù)量的項(xiàng)吊履,且同時(shí)刪除任意數(shù)量的項(xiàng)安皱,只需指定 3 個(gè)參數(shù):起始位置调鬓、要?jiǎng)h除的項(xiàng)數(shù)和要插入的任意數(shù)量的項(xiàng)艇炎。插入的項(xiàng)數(shù)不必與刪除的項(xiàng)數(shù)相等。例如腾窝,splice (2,1,4,6)會(huì)刪除當(dāng)前數(shù)組位置 2 的項(xiàng)缀踪,然后再從位置 2 開始插入4和6。
注:splice()方法始終都會(huì)返回一個(gè)數(shù)組虹脯,該數(shù)組中包含從原始數(shù)組中刪除的項(xiàng)驴娃,如果沒有刪除任何項(xiàng),則返回一個(gè)空數(shù)組循集。
var arr = [1,3,5,7,9,11];
var arrRemoved = arr.splice(0,2);
console.log(arr); //[5,7,9,11]
console.log(arrRemoved); //[1,3]
var arrRemoved2 = arr.splice(2,0,4,6);
console.log(arr);//[5,7,4,6,9,11]
console.log(arrRemoved2);//[] 從原始數(shù)組中刪除0項(xiàng)唇敞,所以返回[]
var arrRemoved3 = arr.splice(1,1,2,4);
console.log(arr); //[5,2,4,4,6,9,11]
console.log(arrRemoved3);//[7]
8.concat()
concat()將參數(shù)添加到原數(shù)組中,這個(gè)方法會(huì)先創(chuàng)建當(dāng)前數(shù)組的一個(gè)副本咒彤,然后將接收到的參數(shù)添加到這個(gè)副本的末尾疆柔,最后返回新構(gòu)建的數(shù)組。在沒有給concat()方法傳遞參數(shù)的情況下镶柱,它只是復(fù)制當(dāng)前數(shù)組并返回副本旷档。===》不改變?cè)瓟?shù)組
var arr=[1,2,3,5];
var arrCopy = arr.concat(8,[11,2]);
console.log(arrCopy);//[1,2,3,5,8,11,2]
console.log(arr) //[1,2,3,5]
從上面測(cè)試結(jié)果可以發(fā)現(xiàn):傳入的不是數(shù)組,則直接把參數(shù)添加到數(shù)組后面歇拆,如果傳入的是數(shù)組鞋屈,則將數(shù)組中的各個(gè)項(xiàng)添加到數(shù)組中。但是如果傳入的是一個(gè)二維數(shù)組呢故觅?
var arrCopy2 = arr.concat([9,[11,13]]);
console.log(arrCopy2); //[1,2, 3, 5, 9, Array[2]]
console.log(arrCopy2[5]); //[11, 13]
上述代碼中厂庇,arrCopy2數(shù)組的第五項(xiàng)是一個(gè)包含兩項(xiàng)的數(shù)組,也就是說concat方法只能將傳入數(shù)組中的每一項(xiàng)添加到數(shù)組中输吏,如果傳入數(shù)組中有些項(xiàng)是數(shù)組权旷,那么也會(huì)把這一數(shù)組項(xiàng)當(dāng)作一項(xiàng)添加到arrCopy2中。
9.slice()
slice()返回從原數(shù)組中指定開始下標(biāo)到結(jié)束下標(biāo)之間的項(xiàng)組成的新數(shù)組评也。slice()方法可以接受一或兩個(gè)參數(shù)炼杖,即要返回項(xiàng)的起始和結(jié)束位置灭返。在只有一個(gè)參數(shù)的情況下,slice()方法返回從該參數(shù)指定位置開始到當(dāng)前數(shù)組末尾的所有項(xiàng)坤邪。如果有兩個(gè)參數(shù)熙含,該方法返回起始和結(jié)束位置之間的項(xiàng)——但不包括結(jié)束位置的項(xiàng)。
var arr = [1,3,5,7,9,11];
var arrCopy = arr.slice(1);
var arrCopy2 = arr.slice(1,4);
var arrCopy3 = arr.slice(1,-2);
var arrCopy4 = arr.slice(-4,-1);
console.log(arrCopy); //[3,5,7,9,11]
console.log(arr); //[1,3,5,7,9,11] 原數(shù)組沒變
console.log(arrCopy2); //[3,5,7]
console.log(arrCopy3); //[3,5,7]
console.log(arrCopy4); //[5,7,9]
arrCopy只設(shè)置了一個(gè)參數(shù)艇纺,也就是起始下標(biāo)為1怎静,所以返回的數(shù)組為下標(biāo)1(包括下標(biāo)1)開始到數(shù)組最后。
arrCopy2設(shè)置了兩個(gè)參數(shù)黔衡,返回起始下標(biāo)(包括1)開始到終止下標(biāo)(不包括4)的子數(shù)組蚓聘。
arrCopy3設(shè)置了兩個(gè)參數(shù),終止下標(biāo)為負(fù)數(shù)盟劫,當(dāng)出現(xiàn)負(fù)數(shù)時(shí)夜牡,將負(fù)數(shù)加上數(shù)組長度的值(6)來替換該位置的數(shù),因此就是從1開始到4(不包括)的子數(shù)組侣签。
arrCopy4中兩個(gè)參數(shù)都是負(fù)數(shù)塘装,所以都加上數(shù)組長度6轉(zhuǎn)換成正數(shù),因此相當(dāng)于slice(2,5)影所。
10.indexOf()和 lastIndexOf()
indexOf():接收兩個(gè)參數(shù):要查找的項(xiàng)和(可選的)表示查找起點(diǎn)位置的索引蹦肴。其中, 從數(shù)組的開頭(位置 0)開始向后查找猴娩。
lastIndexOf:接收兩個(gè)參數(shù):要查找的項(xiàng)和(可選的)表示查找起點(diǎn)位置的索引阴幌。其中, 從數(shù)組的末尾開始向前查找卷中。
這兩個(gè)方法都返回要查找的項(xiàng)在數(shù)組中的位置矛双,或者在沒找到的情況下返回-1。在比較第一個(gè)參數(shù)與數(shù)組中的每一項(xiàng)時(shí)仓坞,會(huì)使用全等操作符背零。
var arr = [1,3,5,7,7,5,3,1];
console.log(arr.indexOf(5)); //2
console.log(arr.lastIndexOf(5)); //5
console.log(arr.indexOf(5,2)); //2
console.log(arr.lastIndexOf(5,4)); //2
console.log(arr.indexOf("5")); //-1
11.forEach()
forEach():對(duì)數(shù)組進(jìn)行遍歷循環(huán),對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)无埃。這個(gè)方法沒有返回值徙瓶。參數(shù)都是function類型,默認(rèn)有傳參嫉称,參數(shù)分別為:遍歷的數(shù)組內(nèi)容侦镇;對(duì)應(yīng)的數(shù)組索引,數(shù)組本身织阅。
var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){
console.log(x + '|' + index + '|' + (a === arr));
});
// 輸出為:
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true
12.map()
map():指“映射”壳繁,對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù),返回每次函數(shù)調(diào)用的結(jié)果組成的數(shù)組。
下面代碼利用map方法實(shí)現(xiàn)數(shù)組中每個(gè)數(shù)求平方闹炉。
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(function(item){
return item*item;
});
console.log(arr2); //[1, 4, 9, 16, 25]
13.filter()
filter():“過濾”功能蒿赢,數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù),返回滿足過濾條件組成的數(shù)組渣触。
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(x, index) {
return index % 3 === 0 || x >= 8;
});
console.log(arr2); //[1, 4, 7, 8, 9, 10]
14.every()
every():判斷數(shù)組中每一項(xiàng)都是否滿足條件羡棵,只有所有項(xiàng)都滿足條件,才會(huì)返回true嗅钻。
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.every(function(x) {
return x < 10;
});
console.log(arr2); //true
var arr3 = arr.every(function(x) {
return x < 3;
});
console.log(arr3); // false
15.some()
some():判斷數(shù)組中是否存在滿足條件的項(xiàng)皂冰,只要有一項(xiàng)滿足條件,就會(huì)返回true养篓。
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.some(function(x) {
return x < 3;
});
console.log(arr2); //true
var arr3 = arr.some(function(x) {
return x < 1;
});
console.log(arr3); // false
16.reduce()和 reduceRight()
這兩個(gè)方法都會(huì)實(shí)現(xiàn)迭代數(shù)組的所有項(xiàng)秃流,然后構(gòu)建一個(gè)最終返回的值。reduce()方法從數(shù)組的第一項(xiàng)開始柳弄,逐個(gè)遍歷到最后舶胀。而 reduceRight()則從數(shù)組的最后一項(xiàng)開始,向前遍歷到第一項(xiàng)语御。
這兩個(gè)方法都接收兩個(gè)參數(shù):一個(gè)在每一項(xiàng)上調(diào)用的函數(shù)和(可選的)作為歸并基礎(chǔ)的初始值峻贮。
傳給 reduce()和 reduceRight()的函數(shù)接收 4 個(gè)參數(shù):前一個(gè)值、當(dāng)前值应闯、項(xiàng)的索引和數(shù)組對(duì)象。這個(gè)函數(shù)返回的任何值都會(huì)作為第一個(gè)參數(shù)自動(dòng)傳給下一項(xiàng)挂捻。第一次迭代發(fā)生在數(shù)組的第二項(xiàng)上碉纺,因此第一個(gè)參數(shù)是數(shù)組的第一項(xiàng),第二個(gè)參數(shù)就是數(shù)組的第二項(xiàng)刻撒。
下面代碼用reduce()實(shí)現(xiàn)數(shù)組求和骨田,數(shù)組一開始加了一個(gè)初始值10。
var values = [1,2,3,4,5];
var sum = values.reduceRight(function(prev, cur, index, array){
return prev + cur;
},10);
console.log(sum); //25
17.join()
join(separator): 將數(shù)組的元素組起一個(gè)字符串声怔,以separator為分隔符态贤,省略的話則用默認(rèn)用逗號(hào)為分隔符,該方法只接收一個(gè)參數(shù):即分隔符醋火。
var arr = [1,2,3];
console.log(arr.join()); // 1,2,3
console.log(arr.join("-")); // 1-2-3
console.log(arr); // [1, 2, 3](原數(shù)組不變)