JavaScript中的数组方法：map、filter与reduce

JavaScript数组提供了许多强大的方法，其中map、filter和reduce是最常用的三个高阶函数。这些方法可以让我们用更声明式的方式处理数组，而不是依赖传统的for循环。

1. map方法

map()方法创建一个新数组，其结果是该数组中的每个元素调用一个提供的函数后的返回值。

const numbers = [1, 2, 3, 4];const doubled = numbers.map(num => num * 2);console.log(doubled); // [2, 4, 6, 8]

map方法不会改变原数组，而是返回一个新数组。它常用于数据转换场景：

const users = [  { id: 1, name: 'Alice' },  { id: 2, name: 'Bob' },  { id: 3, name: 'Charlie' }];const userIds = users.map(user => user.id);console.log(userIds); // [1, 2, 3]

2. filter方法

filter()方法创建一个新数组，其中包含通过所提供函数实现的测试的所有元素。

const numbers = [1, 2, 3, 4, 5, 6];const evens = numbers.filter(num => num % 2 === 0);console.log(evens); // [2, 4, 6]

filter方法同样不改变原数组，而是返回一个新数组。它常用于数据筛选：

const products = [  { id: 1, name: 'Laptop', inStock: true },  { id: 2, name: 'Phone', inStock: false },  { id: 3, name: 'Tablet', inStock: true }];const availableProducts = products.filter(product => product.inStock);console.log(availableProducts);// [{ id: 1, name: 'Laptop', inStock: true }, { id: 3, name: 'Tablet', inStock: true }]

3. reduce方法

reduce()方法对数组中的每个元素执行一个由您提供的reducer函数，将其结果汇总为单个返回值。

const numbers = [1, 2, 3, 4];const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);console.log(sum); // 10

reduce方法可以用于各种聚合操作：

const cartItems = [  { id: 1, name: 'Book', price: 10 },  { id: 2, name: 'Shirt', price: 20 },  { id: 3, name: 'Pen', price: 5 }];const total = cartItems.reduce((sum, item) => sum + item.price, 0);console.log(total); // 35

reduce也可以用于更复杂的操作，比如将数组转换为对象：

const fruits = ['apple', 'banana', 'orange'];const fruitMap = fruits.reduce((obj, fruit, index) => {  obj[index] = fruit;  return obj;}, {});console.log(fruitMap); // { 0: 'apple', 1: 'banana', 2: 'orange' }

4. 方法链式调用

这些方法可以链式调用，实现复杂的数据处理：

const transactions = [  { id: 1, amount: 100, currency: 'USD' },  { id: 2, amount: 200, currency: 'EUR' },  { id: 3, amount: 50, currency: 'USD' },  { id: 4, amount: 300, currency: 'GBP' }];const totalUSD = transactions  .filter(tx => tx.currency === 'USD')  .map(tx => tx.amount)  .reduce((sum, amount) => sum + amount, 0);console.log(totalUSD); // 150

总结

map: 转换数组中的每个元素，返回新数组filter: 筛选数组元素，返回满足条件的元素组成的新数组reduce: 将数组元素聚合成单个值

这些高阶函数使代码更简洁、更易读，是现代化JavaScript开发中的重要工具。