這篇文章要跟大家分享的是ES5與ES6數組方法總結，有需要的小夥伴可以看一下

Array 物件屬性

constructor 返回對創建此物件的數組函數的參考。
length 設定或傳回陣列中元素的數量。
prototype 讓您有能力在物件上新增屬性和方法。

傳統Array 物件方法

toSource() 傳回該物件的原始程式碼。
toString() 把陣列轉換成字串，並回傳結果。
toLocaleString() 把陣列轉換為本機數組，並傳回結果。
valueOf() 傳回陣列物件的原始值

修改原始陣列

push() 新增至陣列的末端一個或更多元素，並返回新的長度。
unshift() 在陣列的開頭新增一個或更多元素，並傳回新的長度。

pop() 刪除並傳回陣列的最後一個元素
shift() 刪除並傳回陣列的第一個元素

sort() 將陣列的元素進行排序
reverse() 顛倒數組中元素的順序。
splice() 刪除元素，並在陣列中新增元素。

splice

語法

arrayObject.splice(index,howmany,item1,.....,itemX)

var arr = new Array();
arr[0] = "George";
arr[1] = "John";
arr[2] = "Thomas";

arr.splice(2,1);               //"George", "John"
arr.splice(1,0,"William");     //"George", "William", "John"
arr.splice(2,1,"haha");        //"George", "William", "haha"

登入後複製

不修改原始陣列

concat() 連接兩個或更多的陣列，並傳回結果。
join() 把陣列的所有元素放入一個字串。元素透過指定的分隔符號進行分隔。
slice() 從某個已有的陣列傳回選取的元素

slice

語法

arrayObject.slice(start,end);

start 必需。規定從何處開始選取。可為負，從數組尾部開始算起。
end 可選。規定從何處結束選取。如果沒有指定，那麼切分的陣列包含從 start 到陣列結束的所有元素。可為負，從數組尾部開始算起。

var arr = new Array();
arr[0] = "George";
arr[1] = "John";
arr[2] = "Thomas";

arr.slice(2,1);         //[]
arr.slice(1,2);         //"William"
arr.slice(-2,-1);         //"William"

登入後複製

將類似陣列的物件(例如arguments)轉換為真實的陣列
Array.prototype.slice.call(arguments);

ES5新增陣列

索引方法：indexOf()，lastIndexOf()
迭代方法：forEach()、map()、filter()、 some()、every()
歸併方法：reduce()、reduceRight()

方法並不會修改原始數組

索引方法

indexOf

array.indexOf(searchElement[, fromIndex])

登入後複製

傳回整數索引值，如果沒有符合（嚴格符合），則傳回-1。
fromIndex可選，表示從這個位置開始搜索，若缺省或格式不合要求，使用預設值0。

var data = [2, 5, 7, 3, 5];

console.log(data.indexOf(5, "x")); // 1 ("x"被忽略)
console.log(data.indexOf(5, "3")); // 4 (从3号位开始搜索)

登入後複製

lastIndexOf

array.lastIndexOf(searchElement[, fromIndex])

登入後複製

#從字串的結尾開始尋找，而不是從開頭。
fromIndex的預設值是array.length - 1。

var data = [2, 5, 7, 3, 5];

console.log(data.lastIndexOf(5)); // 4
console.log(data.lastIndexOf(5, 3)); // 1 (从后往前，索引值小于3的开始搜索)

console.log(data.lastIndexOf(4)); // -1 (未找到)

登入後複製

兩個方法在比較第一個參數與陣列中的每一項時，會使用全等運算符，要求必須完全相等,否則傳回-1。

迭代方法

每個方法都接受兩個參數，第一個參數callback（回呼函數，必選），第二個參數是一個可選的上下文參數。

其中第一個參數callback接受三個參數，當前項的值、目前項目在陣列中的索引、陣列物件本身。即 function(value,index,arr) {}；需要注意的是與我們常用的jQuery中封裝的方法區別在第一個參數和第二個參數，即index和value的順序是相反的。
第二個參數是一個可選的上下文參數，是執行第一個函數參數的作用域對象，也就是上面說的callback中this所指向的值。如果這第2個可選參數不指定，則使用全域物件代替（在瀏覽器是為window），嚴格模式下甚至是undefined。

要注意的是除了forEach()方法，其餘的迭代方法中callback需要有return值否則會回傳undefined。

forEach

forEach()對陣列進行遍歷循環，對陣列中的每一項運行給定的函數，這個方法沒有傳回值。

[].forEach(function(value, index, array) {
    // ...
}, [ thisObject]);

登入後複製

forEach除了接受一個必須的回呼函數參數，還可以接受一個可選的上下文參數（改變回呼函數裡面的this指向）（第2個參數）。
如果這第2個可選參數不指定，則使用全域物件取代（在瀏覽器是為window），嚴格模式甚至是undefined.

[1, 2, 3, 4].forEach(function (item, index, array) {
  console.log(array[index] == item); // true
  sum += item;
});

alert(sum); // 10

var database = {
  users: ["张含韵", "江一燕", "李小璐"],
  sendEmail: function (user) {
    if (this.isValidUser(user)) {
      console.log("你好，" + user);
    } else {
      console.log("抱歉，"+ user +"，你不是本家人");    
    }
  },
  isValidUser: function (user) {
    return /^张/.test(user);
  }
};

// 给每个人法邮件
database.users.forEach(  // database.users中人遍历
  database.sendEmail,    // 发送邮件
  database               // 使用database代替上面标红的this
);

// 结果：
// 你好，张含韵
// 抱歉，江一燕，你不是本家人
// 抱歉，李小璐，你不是本家

登入後複製

map

map()指“映射”，對數組中的每一項運行給定的函數，返回每次函數調用的結果組成的數組。

[].map(function(value, index, array) {
    // ...
}, [ thisObject]);

登入後複製

var data = [1, 2, 3, 4];

var arrayOfSquares = data.map(function (item) {
  return item * item;
});

alert(arrayOfSquares); // 1, 4, 9, 16

登入後複製

filter

filter()，“过滤”，对数组中的每一项运行给定函数，返回满足过滤条件组成的数组。

array.filter(callback,[ thisObject]);

登入後複製

filter的callback函数需要返回布尔值true或false。
返回值只要是弱等于== true/false就可以了，而非非得返回 === true/false。

var arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var flag = arr3.filter(function(value, index) {
  return value % 3 === 0;
}); 
console.log(flag);  // [3, 6, 9]

登入後複製

every

every()，判断数组中每一项都是否满足所给条件，当所有项都满足条件，才会返回true。

array.every(callback,[ thisObject]);

登入後複製

var arr4 = [1, 2, 3, 4, 5];
var flag = arr4.every(function(value, index) {
  return value % 2 === 0;
}); 
console.log(flag);  // false

登入後複製

some

some()，判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回true。

array.some(callback,[ thisObject]);

登入後複製

var arr5 = [1, 2, 3, 4, 5];
var flag = arr5.some(function(value, index) {
  return value % 2 === 0;
}); 
console.log(flag);   // true

登入後複製

归并方法

这两个方法相比前面可能稍微复杂一些，它们都会迭代数组中的所有项，然后生成一个最终返回值。这两个方法接收两个参数。

第一个参数callback，函数接受4个参数分别是（初始值total必选，当前值currentValue必选，索引值currentIndex可选，当前数组arr可选），函数需要返回一个值，这个值会在下一次迭代中作为初始值。
第二个参数是迭代初始值（initialValue），参数可选，如果缺省，初始值为数组第一项，从数组第一个项开始叠加，缺省参数要比正常传值少一次运算。

reduce

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。 reduce() 对于空数组是不会执行回调函数的。

array. reduce(function(total, currentValue, currentIndex, array) {
    // ...
});

登入後複製

var arr9 = [1, 2, 3, 4];
var sum9 =arr9.reduce(function (total, curr, index, array) {
  return total * curr;
});
console.log(sum9);  // 24 
var sum9_1 =arr9.reduce(function (total, curr, index, array) {
  return total * curr;
}, 10);
console.log(sum9_1);  // 240

登入後複製

reduceRight

reduceRight()和reduce()相比，用法类似，差异在于reduceRight是从数组的末尾开始实现的。

array.reduceRight(callback,[ thisObject]);

登入後複製

var arr9 = [2, 45, 30, 80];
var flag = arr9.reduceRight(function (total, curr, index) {
  return total - curr;
});
var flag_1 = arr9.reduceRight(function (total, curr, index) {
  return total - curr;
},200);
console.log(flag);  // 3
console.log(flag_1);  // 43

登入後複製