推荐答案
map、filter 和 reduce 是 JavaScript 数组中常用的高阶函数，它们允许你以声明式的方式处理数组数据，避免了传统的命令式循环，使代码更加简洁易读。
map(): 对数组中的每个元素执行提供的函数，并返回一个新数组，新数组中的元素是原数组元素经过函数处理后的结果。原数组不会被修改。filter(): 创建一个新数组，新数组包含原数组中所有通过所提供函数实现的测试的元素。也就是说，它会根据条件过滤原数组，只保留符合条件的元素。原数组不会被修改。reduce(): 对数组中的每个元素执行一个reducer函数（您提供的），将其结果汇总为单个返回值。reducer 函数的返回值在每次调用中被累积，并最终返回累积的结果。常用于求和、求积、构建对象等操作。原数组不会被修改。
示例：
// www.javascriptcn.com code example const numbers = [1, 2, 3, 4, 5]; // map: 将每个数字乘以 2 const doubledNumbers = numbers.map(number => number * 2); console.log(doubledNumbers); // Output: [2, 4, 6, 8, 10] // filter: 筛选出所有大于 3 的数字 const greaterThanThree = numbers.filter(number => number > 3); console.log(greaterThanThree); // Output: [4, 5] // reduce: 计算所有数字的总和 const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); console.log(sum); // Output: 15
本题详细解读
map() 函数详解
map() 方法接收一个回调函数作为参数，该回调函数会被应用于数组的每一个元素。map() 方法的返回值是一个全新的数组，其长度和原数组相同，新数组的每一个元素都是回调函数的返回值。
语法:
array.map(function(currentValue, index, arr), thisValue)
currentValue：当前正在处理的数组元素。index(可选)：当前正在处理的数组元素的索引。arr(可选)：调用map的原数组。thisValue(可选)：执行回调函数时用作this的值。
示例：
// www.javascriptcn.com code example
const names = ["Alice", "Bob", "Charlie"];
// 将数组中的字符串转换为大写形式
const upperCaseNames = names.map(name => name.toUpperCase());
console.log(upperCaseNames); // Output: ["ALICE", "BOB", "CHARLIE"]
// 创建一个包含对象的新数组，每个对象包含原数组元素的名称和索引
const nameObjects = names.map((name, index) => ({ name, index }));
console.log(nameObjects); // Output: [{ name: 'Alice', index: 0 }, { name: 'Bob', index: 1 }, { name: 'Charlie', index: 2 }]
filter() 函数详解
filter() 方法接收一个回调函数作为参数，该回调函数会被应用于数组的每一个元素。filter() 方法返回一个新数组，新数组只包含原数组中回调函数返回 true 的元素。
语法:
array.filter(function(currentValue, index, arr), thisValue)
currentValue：当前正在处理的数组元素。index(可选)：当前正在处理的数组元素的索引。arr(可选)：调用filter的原数组。thisValue(可选)：执行回调函数时用作this的值。
示例：
// www.javascriptcn.com code example const ages = [10, 18, 25, 12, 30]; // 筛选出年龄大于等于 18 岁的元素 const adults = ages.filter(age => age >= 18); console.log(adults); // Output: [18, 25, 30] const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; // 筛选出长度大于 6 的单词 const longWords = words.filter(word => word.length > 6); console.log(longWords); // Output: ["exuberant", "destruction", "present"]
reduce() 函数详解
reduce() 方法接收一个回调函数（reducer）和一个初始值作为参数，回调函数会被应用于数组的每一个元素，并最终返回一个累积的结果。reduce() 方法常用于将数组中的元素进行聚合，例如求和、求积、构建对象等等。
语法:
array.reduce(function(accumulator, currentValue, currentIndex, arr), initialValue)
accumulator: 累加器，它会接收上一次回调函数的返回值或者初始值（在第一次执行时）。currentValue: 当前正在处理的数组元素。currentIndex(可选): 当前正在处理的数组元素的索引。arr(可选): 调用reduce的原数组。initialValue(可选): 作为第一次调用回调函数时的第一个参数的值，如果没有提供，则使用数组的第一个元素作为初始值，并从数组的第二个元素开始执行回调函数。
示例：
// www.javascriptcn.com code example
const prices = [10, 20, 30, 40];
// 计算所有价格的总和
const totalPrice = prices.reduce((sum, price) => sum + price, 0);
console.log(totalPrice); // Output: 100
// 计算所有价格的乘积
const product = prices.reduce((accumulator, currentValue) => accumulator * currentValue, 1);
console.log(product) // Output: 240000
const items = [
{ id: 1, name: 'apple', quantity: 2 },
{ id: 2, name: 'banana', quantity: 3 },
{ id: 3, name: 'cherry', quantity: 1 }
];
// 将数组转换为对象，以 id 为键，以对象为值
const itemMap = items.reduce((obj, item) => {
obj[item.id] = item;
return obj;
}, {});
console.log(itemMap) // Output: {1: {…}, 2: {…}, 3: {…}}