JavaScript 具有用於陣列轉換的內建迭代方法。讓我們來分析一下filter()、map()、reduce()以及它們的使用條件。
Array.filter()
它會建立一個新數組，其中包含透過所提供函數實現的測試的所有元素。 它為數組中的每個元素調用一次提供的回調函數，並傳回回調函數傳回 true 的所有值的新數組。
文法
filter(callbackFn) filter(callbackFn, thisArg)
其計算結果為：Array.filter((element, index, array) => { ... } )
callbackFn 是一個為數組中的每個元素執行的函數，它應該傳回一個 true 值以保留結果數組的元素，否則傳回 false 值。此函數接受三個參數：當前元素、索引和陣列本身。
在下面的範例中，給定一個數字數組並期望找到偶數，filter() 方法的使用如下所示：
const numbers = [1, 2, 3, 4, 5, 6]; const evenNumbers = numbers.filter(number => number % 2 === 0); console.log(evenNumbers); // Output: [2, 4, 6]
Array.map()
map() 方法建立一個新數組，其中填充了對目前數組中每個元素呼叫所提供函數的結果。它僅對已賦值的陣列索引呼叫回調函數，對空槽不呼叫回調函數。
文法
map(callbackFn) map(callbackFn, thisArg)
這簡單翻譯為：Arrays.map((element, index, array) => { ... })
callbackFn 是一個對數組中的每個元素執行的函數，返回值將作為單一元素添加到新數組中。
此函數接受三個參數：目前元素、索引和陣列本身。
給定一個數字數組並期望返回它們的平方，map() 方法將是最有效的，如下所示：
const numbers = [1, 2, 3, 4, 5]; const squareNumbers = numbers.map(number => number ** 2); console.log(squareNumbers); // Output: [1, 4, 9, 16, 25]
我們正在將一個陣列的值對應到另一個陣列。
Array.reduce()
reduce() 方法按升序索引順序對數組的每個元素運行回調函數縮減器，並傳入前一個元素計算的回傳值。在所有數組元素上運行減速器的最終結果是單一值。
如果提供了初始值，它將用作回呼的第一次呼叫中的第一個參數。如果沒有提供初始值，則使用陣列的第一個元素作為初始值，然後從第二個元素開始迭代。
文法
reduce(callbackFn) reduce(callbackFn, initialValue)
callbackFn 是對陣列中的每個元素執行的函數。它的傳回值將成為下次呼叫回呼時累加器參數的值。對於最後一次調用，返回值成為reduce()函數的返回值。
它採用以下參數：累加器、currentValue、currentIndex 和呼叫它的陣列。
使用數字數組並負責查找它們的總和，reduce() 方法可以輕鬆地對其進行評估，如下所示：
const numbers = [1, 2, 3, 4, 5]; const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); console.log(sum); // Output: 15
結論
這些方法filter()、map()和reduce()對於陣列迭代和運算是必不可少的。
filter() 最適合尋找給定數組中滿足回調函數條件的所有元素。
map() 是一種非破壞性數組方法，最適合用於操作給定數組中的資料並期望返回值。
reduce() 對於基於縮減函數將數組元素聚合為單一值非常有用。
參考文獻
Array.prototype.filter 上的 MDN Web 文件
Array.prototype.map 上的 MDN Web 文件
Array.prototype.reduce 上的 MDN Web 文件
以上是理解JS中的陣列迭代器方法：filter、map和reduce的詳細內容。更多資訊請關注PHP中文網其他相關文章！
