es6 filter方法的參數是什么

ES6 Filter方法的參數是什么

在ES6（ECMAScript 2015）中，Array.prototype.filter 是一個非常常用的數組方法，用于創建一個新數組，其中包含通過指定函數測試的所有元素。filter 方法的核心在于其回調函數，理解其參數對于正確使用該方法至關重要。

1. filter 方法的基本語法

filter 方法的基本語法如下：

const newArray = array.filter(callback(element, index, array), thisArg);

• array: 原始數組。
• callback: 用于測試每個元素的函數。
• thisArg (可選): 執行 callback 時使用的 this 值。

2. callback 函數的參數

callback 函數是 filter 方法的核心，它接受三個參數：

2.1 element

element 是當前正在處理的數組元素。filter 方法會遍歷數組中的每個元素，并將當前元素作為 element 參數傳遞給 callback 函數。

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function(element) {
  return element % 2 === 0;
});
console.log(evenNumbers); // 輸出: [2, 4]

在這個例子中，element 依次為 1, 2, 3, 4, 5。

2.2 index

index 是當前正在處理的元素的索引。filter 方法會將當前元素的索引作為 index 參數傳遞給 callback 函數。

const numbers = [1, 2, 3, 4, 5];
const evenIndexNumbers = numbers.filter(function(element, index) {
  return index % 2 === 0;
});
console.log(evenIndexNumbers); // 輸出: [1, 3, 5]

在這個例子中，index 依次為 0, 1, 2, 3, 4。

2.3 array

array 是調用 filter 方法的原始數組。filter 方法會將原始數組作為 array 參數傳遞給 callback 函數。

const numbers = [1, 2, 3, 4, 5];
const filteredNumbers = numbers.filter(function(element, index, array) {
  console.log(array); // 輸出: [1, 2, 3, 4, 5]
  return element > 2;
});
console.log(filteredNumbers); // 輸出: [3, 4, 5]

在這個例子中，array 始終為 [1, 2, 3, 4, 5]。

3. thisArg 參數

thisArg 是一個可選參數，用于指定 callback 函數執行時的 this 值。如果提供了 thisArg，則在 callback 函數內部可以通過 this 訪問到它。

const numbers = [1, 2, 3, 4, 5];
const threshold = 3;
const filteredNumbers = numbers.filter(function(element) {
  return element > this.threshold;
}, { threshold: 2 });
console.log(filteredNumbers); // 輸出: [3, 4, 5]

在這個例子中，thisArg 是一個包含 threshold 屬性的對象，callback 函數通過 this.threshold 訪問到 2。

4. 總結

filter 方法的參數主要包括 callback 函數和可選的 thisArg。callback 函數接受三個參數：element（當前元素）、index（當前索引）和 array（原始數組）。理解這些參數的作用，可以幫助我們更靈活地使用 filter 方法來處理數組數據。

通過合理利用 filter 方法，我們可以輕松地從數組中篩選出符合特定條件的元素，從而簡化代碼并提高開發效率。