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

JavaScript提供了许多强大的数组方法，其中map、filter和reduce是最常用且功能强大的三个方法。它们都属于高阶函数，因为它们可以接受函数作为参数。

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];const evens = numbers.filter(num => num % 2 === 0);console.log(evens); // [2, 4]

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方法接受两个参数：

一个reducer函数（包含accumulator, currentValue, currentIndex, array四个参数）初始值（可选）

更复杂的例子：

const orders = [  { id: 1, total: 100 },  { id: 2, total: 200 },  { id: 3, total: 300 }];const totalAmount = orders.reduce((sum, order) => sum + order.total, 0);console.log(totalAmount); // 600

方法链式调用

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

const products = [  { id: 1, name: 'Laptop', price: 999, category: 'electronics' },  { id: 2, name: 'Shirt', price: 25, category: 'clothing' },  { id: 3, name: 'Phone', price: 699, category: 'electronics' },  { id: 4, name: 'Pants', price: 45, category: 'clothing' }];const result = products  .filter(product => product.category === 'electronics')  .map(product => ({ ...product, price: product.price * 1.2 })) // 增加20%价格  .reduce((total, product) => total + product.price, 0);console.log(result); // (999*1.2 + 699*1.2) = 2037.6

这三个方法都是纯函数，不会改变原数组，而是返回新的数组或值，这使得它们非常适合函数式编程范式。