公司网站打不开怎么办,网站引导制作,人社局网站建设管理工作总结,沈阳工程建设信息网站reduce 是 JavaScript 中 Array 对象的一个方法#xff0c;用于对数组中的每个元素执行一个提供的函数#xff08;称为 reducer 函数#xff09;#xff0c;并将其结果汇总为单个返回值。它是一种高阶函数#xff0c;可以用于数组的累积操作#xff0c;例如求和、计算乘积…reduce 是 JavaScript 中 Array 对象的一个方法用于对数组中的每个元素执行一个提供的函数称为 reducer 函数并将其结果汇总为单个返回值。它是一种高阶函数可以用于数组的累积操作例如求和、计算乘积、拼接字符串、计算平均值等。
语法
array.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])参数
callback在数组的每个元素上执行的函数接受四个参数 accumulator累积器累积回调的返回值它是上一次调用回调时返回的累积值或初始值initialValue。currentValue数组中正在处理的元素。index可选数组中正在处理的当前元素的索引。对于初次调用索引为0如果提供了初始值或1如果未提供初始值。array可选调用 reduce 的数组。 initialValue可选作为第一次调用 callback 函数时第一个参数的值。如果没有提供初始值reduce 会从索引1的元素开始执行 callback 方法accumulator 是数组中的第一个元素。
返回值
函数最终的累积结果。
示例
1. 数组求和
const numbers [1, 2, 3, 4, 5];
const sum numbers.reduce((accumulator, currentValue) accumulator currentValue, 0);
console.log(sum); // 输出152. 数组乘积
const numbers [1, 2, 3, 4, 5];
const product numbers.reduce((accumulator, currentValue) accumulator * currentValue, 1);
console.log(product); // 输出1203. 数组扁平化
const nestedArray [[0, 1], [2, 3], [4, 5]];
const flattenedArray nestedArray.reduce((accumulator, currentValue) accumulator.concat(currentValue), []);
console.log(flattenedArray); // 输出[0, 1, 2, 3, 4, 5]4. 计算数组中元素出现的次数
const names [Alice, Bob, Tiff, Bruce, Alice];
const nameCount names.reduce((accumulator, currentValue) {accumulator[currentValue] (accumulator[currentValue] || 0) 1;return accumulator;
}, {});
console.log(nameCount); // 输出{ Alice: 2, Bob: 1, Tiff: 1, Bruce: 1 }5. 按属性对对象数组进行分组
const people [{ name: Alice, age: 21 },{ name: Bob, age: 21 },{ name: Tiff, age: 24 },{ name: Bruce, age: 21 }
];
const groupedByAge people.reduce((accumulator, currentValue) {const age currentValue.age;if (!accumulator[age]) {accumulator[age] [];}accumulator[age].push(currentValue);return accumulator;
}, {});
console.log(groupedByAge);
// 输出{ 21: [{ name: Alice, age: 21 }, { name: Bob, age: 21 }, { name: Bruce, age: 21 }], 24: [{ name: Tiff, age: 24 }] }总结
reduce 方法非常强大适用于各种需要将数组汇总为单个值的操作。通过提供一个初始值reduce 可以灵活地处理数组的不同类型的数据和复杂的逻辑。掌握 reduce 方法有助于编写简洁、高效的 JavaScript 代码。
要手写一个 reduce 函数可以按照 Array.prototype.reduce 的规范来实现。我们的 reduce 函数将接受两个参数一个回调函数和一个可选的初始值。回调函数会在数组的每一个元素上执行并传入累积器、当前值、当前索引和数组本身。最后我们的 reduce 函数会返回累积的结果。
以下是手写 reduce 的代码实现
// 手写 reduce 函数
function myReduce(array, callback, initialValue) {// 验证输入if (!Array.isArray(array)) {throw new TypeError(First argument must be an array);}if (typeof callback ! function) {throw new TypeError(Second argument must be a function);}// 初始化变量let accumulator;let startIndex;// 判断是否传入 initialValueif (initialValue ! undefined) {accumulator initialValue;startIndex 0;} else {if (array.length 0) {throw new TypeError(Reduce of empty array with no initial value);}accumulator array[0];startIndex 1;}// 遍历数组for (let i startIndex; i array.length; i) {accumulator callback(accumulator, array[i], i, array);}return accumulator;
}// 测试我们的 myReduce 函数
const numbers [1, 2, 3, 4, 5];
const sum myReduce(numbers, (accumulator, currentValue) accumulator currentValue, 0);
console.log(sum); // 输出15const product myReduce(numbers, (accumulator, currentValue) accumulator * currentValue, 1);
console.log(product); // 输出120// 不传初始值
const sumWithoutInitial myReduce(numbers, (accumulator, currentValue) accumulator currentValue);
console.log(sumWithoutInitial); // 输出15代码解释 输入验证 检查第一个参数是否为数组如果不是抛出类型错误。检查第二个参数是否为函数如果不是抛出类型错误。 初始化变量 如果传入了初始值将 accumulator 初始化为初始值startIndex 初始化为 0。如果没有传入初始值确保数组不为空然后将 accumulator 初始化为数组的第一个元素startIndex 初始化为 1。 遍历数组 从 startIndex 开始遍历数组的每一个元素调用回调函数并更新 accumulator。 返回结果 遍历结束后返回累积的结果 accumulator。
这个手写的 reduce 函数模仿了 Array.prototype.reduce 的行为能够处理传入初始值和不传入初始值的情况并在处理空数组时做了相应的错误处理。
