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,333,4"
sy.sort(function(a,b){
            return a-b;
});                                    

註：這裡使用匿名函數最合適，因為只呼叫一次，無需指定函數名稱

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()是从尾到头进行搜索。