JS中數組的方法

在js中數組的重要性不言而喻，下面就來介紹一些數組的經常使用方法

1、基本方法

　　1.增

　　①.  arr.push()

　　　　在數組的末尾添加一個元素。

 

 var arr = [1,2,3,4]; var newArr = arr.push(8); console.log(arr);　　//(5) [1, 2, 3, 4, 8]

 

　　　　該方法會改變原數組，在數組的最後一位直接插入一個元素，增長數組的長度。

　　②   arr.unshift()

　　　　在數組的第一位添加一個元素。

var arr = [1,2,3,4] arr.unshift("l") console.log(arr)　　//(5) ["l", 1, 2, 3, 4]

　　　　該方法也會改變原數組，在數組的第一位添加一個元素，增長數組的長度。

　　二、刪

　　①   arr.pop()

　　　　刪除數組的最後一位元素。

var arr = [1,2,3,4]; arr.pop(); console.log(arr);　　//(3) [1, 2, 3]

　　　　該方法一樣會改變原數組。

　　②   arr.shift()

　　　　刪除數組的第一位元素。

var arr = [1,2,3,4]; arr.shift(); console.log(arr);　　//(3) [2, 3, 4]

　　　　該方法也會改變原數組。

　　③   arr.splice(n,m,a)

　　　　表示從第從索引爲n開始刪除，一共刪除m個；a可選，表示在刪除的地方添加一個新的元素a。

var arr = [1,2,3,4]; var newArr = arr.splice(1,2); console.log(newArr);　　//(2) [2, 3] console.log(arr);　　//(2) [1, 4]

　　　　該方法也同樣會改變數組。

　　④   arr.slice(n.m)

　　　　表示從索引爲n的元素開始截取，截取到下標爲m的前一個。返回一個新的數組，並無改變原數組。

var arr = [1,2,3,4]; var arr2 = arr.slice(1,3); console.log(arr2);　　//(2) [2, 3] console.log(arr);　　//(4) [1, 2, 3, 4]

　　　　Tip：這裏要注意和arr.splice()方法的區別，不要混淆。

 

2、ES5中新增的數組的方法

一、arr.indexOf()

　　arr.indexOf(data,start)有兩個參數，第二個參數可選，表示的是從索引爲start開始檢測；該方法能夠用來檢測數組中是否含有某個元素，返回值爲該元素在數組中的索引，當數組中不包含該元素的時候，返回值爲-1；所以該方法也能夠用來檢測數組中是否含有某個元素；

var arr = [1,2,3,4]; var res = arr.indexOf("a"); console.log(res);　　//返回值爲-1；

　　補充一個arr.lastIndexOf(),用法同arr.indexOf(),可是arr.lastIndexOf()是從後開始向前檢索。

二、forEach(callback)

　　該方法能夠用來循環遍歷數組；參數爲回調函數。下面先來看一下結構。

var arr = ['a','b','c','d']; arr.forEach(function(e,i,arr){ console.log(e); }) // "a" "b" "c" "d"
 arr.forEach(function(e,i,arr){ console.log(i); }) // 0,1,2,3
 arr.forEach(function(e,i,arr){ console.log(arr); }) // ['a','b','c','d']
  // ['a','b','c','d']
  // ['a','b','c','d']
  // ['a','b','c','d']

　　經過上面的代碼能夠看出，arr.forEach()要接受一個回調函數，該函數有三個參數，這裏的e表示元素，i表示索引，arr表示的是數組。

　　爲了方便理解，下面經過一個案例來看一下for.Each()的用法。

var arr = [-1,-2,32,15,-8]; var arrNew = []; arr.forEach(function(e,i,arr){ e < 0 ? e = -e : e; arrNew.push(e); }) console.log(arrNew) // [1, 2, 32, 15, 8]

三、arr.map(callback)

　　該方法同for.Each()同樣也能夠對數組進行遍歷，用法也和for.Each()同樣，在這裏就不作過多的介紹；

　　arr.map()方法不只能夠遍歷數組，還能夠對數組進行計算；

var arr = [1,2,3,4]; var newArr = arr.map(function(e,index,arr){ return e-1; }) console.log(newArr); // [0, 1, 2, 3]

四、arr.filter(callback)

　　過濾數組，也能夠遍歷數組；

var arr = [1,2,3,4]; var newArr = arr.filter(function(e,index,arr){ return e > 2; }) console.log(newArr); // [3, 4]

　　如上代碼，能夠使用該方法將數組中的值小於2的值過濾掉，返回一個新的符合回調函數內條件的數組。

五、arr.evey(callback)

　　使用該方法，若是數組中的每個元素都符合回調函數內的條件，則返回true，不然返回false；

//效果是咱們斷定這個數組全是正數 使用.every
var arr = [1,58,125,-12,458,12]; var Boon = arr.every(function(e,i,arr){ return e > 0; }) console.log(Boon) //false

六、arr.some(callback)

　　該方法和every有點相似，只不過當數組中又至少一個符合條件的時候都返回true，當所有都不符合的時候，才返回false；

//效果是咱們斷定這個數組是否有一個負數 使用.some
var arr = [1,58,125,-12,458,12]; var Boon = arr.some(function(e,i,arr){ return e < 0; }) console.log(Boon) // ture

七、arr.reduce(callback)

　　這個方法比較複雜，咱們來看一個例子 

　　代碼以下：

　　　　var arr1 = [1,7,5,7,1,3]; var arr2 = arr1.reduce(function(prev,cur,index,arr){ console.log(prev); return prev + cur; }); console.log("結果爲" + arr2); // 1
        // 8
        // 13
        // 20
        // 21
        // 結果爲24

　　具體看這個代碼，首先咱們在傳入reduce的函數中打印了prev值，能夠看到prev就是數組每兩項的和。好比第一個是1，第二個就是1+7 = 8，以此類推。

最後，咱們把結果返回。這是沒設置第二個參數的狀況。

　　下面咱們來看看設置了第二個參數爲2的例子。

　　　　　var arr1 = [1,7,5,7,1,3]; var arr2 = arr1.reduce(function(prev,cur,index,arr){ console.log(prev); return prev + cur; },2); console.log("結果爲" + arr2); // 2
        // 3
        // 10
        // 15
        // 22 
        // 23
        // 結果爲26

　　咱們能夠看出，當設置了第二個參數。咱們第一個prev輸出的結果就是第二個參數的值。設置了這個參數，會多執行一次

　　利用這種方法，咱們能夠快速的把二維數組轉化爲一維數組。

var arr1 = [ [1,2], [3,4], [5,6] ] var arr2 = arr1.reduce(function(prev,cur,index,arr){ return prev.concat(cur); }); console.log(arr2)　　//[1, 2, 3, 4, 5, 6] 

　　看到這裏相信arr.reduceRight()的用法你也應該會了吧，和arr.reduce()相似，只不過是從右向左而已，在這裏就不詳細的介紹啦。

　　

 

原文出處：https://www.cnblogs.com/mengshou/p/11432528.html