JS中数组的方法

在js中数组的重要性不言而喻，下面就来介绍一些数组的常用方法

一、基本方法

　　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]

　　　　该方法也会改变原数组，在数组的第一位添加一个元素，增加数组的长度。

　　2、删

　　①   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()方法的区别，不要混淆。

二、ES5中新增的数组的方法

1、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()是从后开始向前检索。

2、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]

3、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]

4、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的值过滤掉，返回一个新的符合回调函数内条件的数组。

5、arr.every(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

6、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

7、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()类似，只不过是从右向左而已，在这里就不详细的介绍啦。