數組filter()參數詳解，巧用filter()數組去重

數組方法挺多，但是用來用去可能也就foreach，splice以及slice接觸較多，filter()說實話之前也沒過多了解。其實filter()為數組提供過濾功能，它會遍歷數組所有元素，並返回滿足條件的元素組成的新數組，filter()不會修改原數組如下：

第一位形參

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(x) {
return x >= 8;
}); 
console.log(arr2); //[8, 9, 10]

上述代碼所做的事情，就是將arr中每個元素一次傳入函數與8進行比較，得出8,9,10。第一個形參X就代表了數組中的元素。

第二位形參

讓我們再來看看如下代碼：

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(x, index) {
return index % 3 === 0 || x >= 8;
}); 
console.log(arr2); //[1, 4, 7, 8, 9, 10]

index代表數組索引，它的循環過程是這樣的，首先傳入元素1，它的索引為0，而0%3===0，滿足了條件。

第二遍傳入了2，索引為1，但1%3！==0，且1比8小，所以被排除，依次循環，得出我們arr2的輸出結果。

第三位形參

我們再來看一段代碼，結合filter進行數組去重

var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7];
var arr2 = arr.filter(function(x, index,self) {
return self.indexOf(x)===index;
}); 
console.log(arr2); //[1, 2, 3, 4, 5, 6 ,7]

這是怎么實現的呢，filter的第三參數self代表數組本身，而indexOf始終返回第一次找到匹配該元素的索引，我們來走走遍歷過程。

第一次循環，傳入元素1，index(1)的索引為0，而此時1的索引本來就是1，OK，滿足。

第二次循環，傳入元素2，index(2)的索引為1，而此時2的索引也是1，OK，也滿足。

第三次循環，傳入元素2，index(2)的索引為1，而此時2的索引為2，OK，不滿足，被PASS，這里就是巧妙的借用了indexOf始終查找到第一次出現的位置。

總結

filter(x,index,self)可以為數組提供過濾功能，其中x代表元素，index是與X一同傳入元素的索引，而self代表數組本身。

就這么多吧。