Javascript中数组方法汇总(推荐)_javascript技巧

Array.prototype中定义了很多操作数组的方法，下面介绍ECMAScript3中的一些方法

1.Array.join()方法

该方法将数组中的元素都转化为字符串并按照指定符号连接到一起，返回最后生成的字符串，可以包含一个参数，为连接数组元素的符号，默认为逗号。

var ay = [1,2,3];
ay.join();       // =>"1,2,3" 
ay.join("+");     // => "1+2+3" 
ay.join(" ");     // =>"1 2 3"
ay.join("");      // =>"123"

var by = new Array(10) //新建一个长度为10的空数组
by.join("-");      //=> "---------" 连接10个空元素

2.Array.reverse()方法

该方法将数组中的元素颠倒顺序，返回逆序的数组，该方法会改变当前数组，不会创建新数组。

复制代码 代码如下:

var a = [1,2,3];
a.reverse().join();    //=>"3,2,1" ,此时a=[3,2,1]   

3.Array.sort()方法

该方法将数组中的元素排序并返回排序后的数组。当sort()方法不带参数时，数组按照字母表顺序排序，如果数组包含undefined元素，会排到数组尾部。

复制代码 代码如下:

var as = ["banana","cherry","apple"];
as.sort();
as.join("+ ");          //=>"apple+ banana+ cherry"

我们也可以给sort()方法传入一个比较函数作为参数，让数组以指定的比较函数进行排序。比较函数返回值小于0，则第一个参数在前，相反返回值大于0，则第二个参数在前，两个参数值相等，则返回0

复制代码 代码如下:

var sy = [1111,222,4,33];
sy.sort();                               //=>"1111,222,33,4"
sy.sort(function(a,b){
            return a-b;
});                                        //=> "4,33,222,1111"

注：这里使用匿名函数最合适，因为只调用一次，无需指定函数名称

4.Array.concat()方法

该方法创建并返回一个新数组，连接原数组元素和方法中每个元素，组成一个新数组。该方法不会递归调用方法中的参数。

复制代码 代码如下:

var a = [1,2,3];
a.concat(4,5);             //=>"1,2,3,4,5"
a.concat([4,5]);           //=>"1,2,3,4,5"
a.concat([4,5],[6,7]);  //=>"1,2,3,4,5,6,7"
a.concat(4,[5,[6,7]]);  //=>"1,2,3,4,5,[6,7]"

5.Array.slice()方法

该方法返回指定数组的一个片段或子数组，该方法可以有两个参数，分别制定片段的开始和结束位置，返回的数组包含第一个参数指定的元素和所有到但不包含第二个参数指定的位置的数组元素。如果只有一个参数，则包含从指定开始位置到数组末尾，参数可以为负值，表示相对于数组中最后一个元素的位置。该方法不会修改被调用的数组。

复制代码 代码如下:

var d =[1,2,3,4,5];
d.slice(1,2);              //=>"2"
d.slice(1,-1);             //=>"2,3,4"
d.slice(3);                 //=>"4,5"
d.slice(-3,-1);           //=>"3,4"

6.Array.splice()方法

该方法是在数组中插入或删除元素的通用方法，该方法会修改原始数组。该方法可以包含多个参数，第一个参数指定要在数组中插入或删除的起始位置，第二个参数制定了删除元素的个数，若不指定则将起始位置以及后面元素全部删除，两个参数之后的参数指定了插入数组的元素，该方法返回由删除元素组成的数组。

var e = [1,2,3,4,5,6];
e.splice(4);          //=> 返回[5,6] ; e是[1,2,3,4]
e.splice(1,2);         //=> 返回[2,3] ; e是[1,4]
      
var f = [1,2,3,4,5];
f.splice(2,0,"a","b");   //=>返回[]; f是[1,2,a,b,3,4,5]
f.splice(2,2,[6,7],3);   //=>返回[a,b]; f是[1,2,[6,7],3,4,5]

7.push()和pop()方法

这两个方法将数组当做栈使用，push()方法是在数组尾部添加一个或多个元素，并返回数组的长度。pop()方法是删除数组的最后一个元素，减少数组长度并返回删除的值。

8.unshift()方法和shift()方法

这两个方法是在数组头部进行添加删除操作，unshift()方法是在数组头部添加一个或多个元素，返回数组长度。shift()方法是删除数组第一个元素并返回。

var a=[];     //[]
a.push(1,2);  //[1,2]
a.pop();      //[1]

a.unshift(2,3); //[2,3,1]
a.shift();      //[3,1]

9.toString()和toLocaleString()方法

这两个方法是将数组每个元素转化为字符串，toString()是将每个元素转化为字符串并且输出用逗号隔开。toLocaleString()方法是数组每个元素调用toLocaleString()转化为字符串，并使用本地化分隔符连接。

下面在介绍几个ECMAScript5中特有的数组方法，在介绍方法之前首先做一个大致了解。大多数方法的第一个参数接受一个函数，并且对数组每个元素调用一次这个函数，如果说稀疏数组，不存在的元素不调用函数。大多数情况下，调用的函数使用三个参数：数组元素，元素的索引以及数组本身。

1.forEach()方法

该方法从头到尾遍历数组，数组每个元素都调用指定的函数。该方法在遍历完所有数组元素之前不会终止。若想提前终止，必须将forEach()放到try块中，并可以抛出异常。

var data=[1,2,3,4,5]
var sum = 0;
data.forEach(function(value){   //=>value为数组元素
  sum+=value;
})                        //=>15

data.forEach(function(value,i,a){ //=>三个参数分别指代数组元素，元素索引和数组
  a[i] = v+1;
})                        //=>data=[2,3,4,5,6]

2.map()方法

该方法将数组的每个元素传递给指定的函数，并返回一个新数组，该数组包含了数组元素调用函数对应的返回值。如果是稀疏数组，返回的新数组也是同样结构的系数数组。

var a=[1,2,3];
var b=a.map(function(v){
  return v*v;
})  //=> b=[1,4,9]

3.filter()方法--类似于条件筛选

该方法返回的是原始数组的一个子集，传递的函数用来做逻辑判定，返回true或false，如果返回的值为true或可以转化为true，则当前数组元素就是子集的成员，添加到返回的数组中。该方法会跳过稀疏数组的空元素。

var a=[5,4,3,2,1]
var smalla=a.filter(function(v){
  return v<3; 
})                         //=>返回[2,1]
var everya=a.filter(function(v,i){ //=>i表示元素索引
  return i%2==0; 
})                         //=>返回[5,3,1]

4.every()和some()方法

这两个方法是对数组进行逻辑判定，对数组每个元素运用指定函数进行判定返回true或false。
every()方法是当且仅当数组中所有元素调用判定函数都返回true,才返回true，否则返回false。
some()方法是当数组中至少有一个元素调用判定函数返回true，就返回true，否则返回false。

这两个方法都是一旦确认返回值后就不在遍历数组元素了。

5.reduce()和reduceRight()方法

这两个方法使用指定的函数将数组元素进行组合，生成单个值。
reduce()需要两个参数，第一个是执行化简组合的操作函数，第二个是组合的初始值。和前面几个方法不同的是，常见的三个参数（数组元素、元素索引和数组本身）会作为操作函数的2~4个参数传递给函数，第一个参数是到目前为止进行计算组合的结果。
如果是针对空数组，并不指定初始值时调用reduce()方法会导致类型错误异常。
reduceRight()方法和reduce()方法的工作原理相同，不同的是其按数组索引从高到低进行处理（即从右到左进行合并处理）

6.indexOf()和lastIndexOf()方法

这两个方法都是用于在整个数组中搜索具体给定的值，并返回第一个匹配元素的索引值，若没有则返回-1.indexOf()方法是从头到尾进行搜索，而lastIndexOf()是从尾到头进行搜索。