陣列中常用的方法還有 filter() 跟 map()，filter() 方法可以根據指定的篩選條件，從陣列裡挑出符合的元素。此外，這兩種方法篩選完結果以後，都會回傳一個新的陣列。

filter 方法的語法

var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

稍微來看一下在 filter 的括號裡那些參數都是什麼意思：

callback / 為一個函數，用來測試所有的元素，回傳值為 true 時將元素保留至新陣列中，回傳為 false 則不保留，並且這個函數會接收到三個參數：

1. element / 原陣列目前反覆處理中的元素。
2. index / 代表目前處理到的元素的索引位置。
3. array / 代表陣列本身。

thisArg 代表 callback 裡面的 this 是指向哪一個物件。

理解了 filter 的內部構造以後，開始來看看 filter 到底有什麼魔法吧。這邊假設我們希望篩選出陣列裡面大於並包含 5 的數字：

let arr = [1,2,3,4,5,10,15,20];
// 如果這邊代入的參數也包括 arr(陣列本身) 那麼也會給予 arr 這個結果
let arr2 = arr.filter(function(value, arr){
	return value >= 5;
});
console.log(arr2); // **5, 10, 15, 20**
console.log(arr); // 1, 2, 3, 4, 5, 10, 15, 20

可以看到 filter 很輕易的就能把我們要篩選的數字抓出來。

那麼假如我們想做一點字串的處理呢？我們在篩選客戶資料，需要抓取客戶名字字數大於五個字的字串元素。這邊我們也可以做一點不同的寫法，當然可以看自己喜歡哪一種就怎麼去寫沒有關係。

function isBigLength(value) {
    return value.length >= 5;
}

let bigLengthNew = ['Aaliyah', 'Adela', 'Bertha', 'Eden', 'Eve', 'Fay'].filter(isBigLength);
console.log(bigLengthNew); // "Aaliyah", "Adela", "Bertha"

那麼 filter 有沒有辦法也很靈活的與其他方法並用呢？其實是可以的，假如我們發現這個陣列裡面有很多不需要的資料，也可以加入 trim 方法，篩選掉一些不用的資料。

let arr = ['Faithe', '', 'Fay', null, undefined, 'Geraldine', ' '];

let arr2 = arr.filter(function (inutile) {
 return inutile && inutile.trim(); 
});

arr2; // "Faithe", "Fay", "Geraldine"

filter 很棒的地方在於，即使像這樣篩選掉不要的資料，或是篩選條件中的資料都不會更動到原有的陣列，因為所有的變動都會出現在新的陣列。

我們還可以利用 filter 過濾掉重複的資料，只要使用 indexOf 方法即可；indexOf 的運作方式，可以看底下小介紹，因此我們可以得知 indexOf 會回傳第一個元素位置，而之後重複的元素只要和第一次回傳的不相等，就會被 filter 過濾掉，因此就不會再出現重複。

indexOf 會回傳指定字串在字串中第一次出現的位置(由左至右)，位置是由 0 開始計算，除了可以從字串頭開始尋找外，也可以指定搜索的起始位置，如果找不到字串則會回傳 -1

indexOf 語法：
arr.indexOf(searchElement[, fromIndex])

searchElement / 準備在陣列中搜尋的元素。
fromIndex / 陣列中搜索的起始索引。

let arr = ["a", 1, 2, 4, 3, 4,5,5, "b", "a"]; 
let arr2 = arr.filter(function(element, index, arr){ 
  return arr.indexOf(element) === index; }); 

console.log(arr2); // "a", 1, 2, 4, 3, 5, "b"

更可以用函式把程式碼整理起來，並且使用 sort 幫忙整理陣列的排序，如此看起來可以更整潔乾淨。

let arr = [8, 5, 7, 2, 6, 3, 1, 4];

function arrDuplicates(arr2) {
  let result = arr2.filter(function(value, index, arrSelf){ 
    return arr.indexOf(value) === index
    });
  return result.sort();
};

arrDuplicates(arr); // 1, 2, 3, 4, 5, 6, 7, 8

其實在寫這篇文章之前，我還不知道 filter 原來有這麼多的好處，資料到處東找找西找找才發現，這個方法真是越看越覺得好用，感謝強大的網路，提供這麼多資料讓我能夠越學越多。