reduce()方法对数组中的每一个元素执行一个reducer函数(由你提供)，从而得到一个单一的输出值。
reduce() 方法将一个数组中的所有元素还原成一个单一的输出值，输出值可以是数字、对象或字符串。 reduce() 方法有两个参数，第一个是回调函数，第二个是初始值。
回调函数回调函数在数组的每个元素上执行。回调函数的返回值是累加结果，并作为下一次调用回调函数的参数提供。回调函数带有四个参数。
accumulator（累加器）——累加器累加回调函数的返回值。current value（当前值）——处理数组的当前元素。current index（当前索引）——处理数组当前元素的索引。source array（源数组）current index 和 source array 是可选的。
初始值如果指定了初始值，则将累加器设置为 initialvalue 作为初始元素。否则，将累加器设置为数组的第一个元素作为初始元素。
arr.reduce(callback(accumulator, currentvalue[,index[,array]])[, initialvalue])
在下面的代码片段中，第一个累加器(accumulator)被分配了初始值0。currentvalue 是正在处理的 numbersarr 数组的元素。在这里，currentvalue 被添加到累加器，在下次调用回调函数时，会将返回值作为参数提供。
const numbersarr = [67, 90, 100, 37, 60]; const total = numbersarr.reduce(function(accumulator, currentvalue){ console.log("accumulator is " + accumulator + " current value is " + currentvalue); return accumulator + currentvalue;}, 0); console.log("total : "+ total);
输出
accumulator is 0 current value is 67accumulator is 67 current value is 90accumulator is 157 current value is 100accumulator is 257 current value is 37accumulator is 294 current value is 60total : 354
javascript reduce用例1.对数组的所有值求和在下面的代码中，studentresult 数组具有5个数字。使用 reduce() 方法，将数组减少为单个值，该值将 studentresult 数组的所有值和结果分配给 total。
const studentresult = [67, 90, 100, 37, 60]; const total = studentresult.reduce((accumulator, currentvalue) => accumulator +currentvalue, 0); console.log(total); // 354
2.对象数组中的数值之和通常，我们从后端获取数据作为对象数组，因此，reduce() 方法有助于管理我们的前端逻辑。在下面的代码中，studentresult 对象数组有三个科目，这里，currentvalue.marks 取了 studentresult 对象数组中每个科目的分数。
const studentresult = [ { subject: '数学', marks: 78 }, { subject: '物理', marks: 80 }, { subject: '化学', marks: 93 }]; const total = studentresult.reduce((accumulator, currentvalue) => accumulator + currentvalue.marks, 0); console.log(total); // 251
3.展平数组“展平数组”是指将多维数组转换为一维。在下面的代码中，twodarr 2维数组被转换为 onedarr 一维数组。此处，第一个 [1,2] 数组分配给累加器 accumulator，然后 twodarr 数组的其余每个元素都连接到累加器。
const twodarr = [ [1,2], [3,4], [5,6], [7,8] , [9,10] ]; const onedarr = twodarr.reduce((accumulator, currentvalue) => accumulator.concat(currentvalue)); console.log(onedarr);// [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]
4.按属性分组对象根据对象的属性，我们可以使用 reduce() 方法将对象数组分为几组。通过下面的代码片段，你可以清楚地理解这个概念。这里，result 对象数组有五个对象，每个对象都有 subject 和 marks 属性。如果分数大于或等于50，则该主题通过，否则，主题失败。
reduce() 用于将结果分组为通过和失败。首先，将 initialvalue 分配给累加器，然后 push() 方法在检查条件之后将当前对象添加到 pass 和 fail 属性中作为对象数组。
const result = [ {subject: '物理', marks: 41}, {subject: '化学', marks: 59}, {subject: '高等数学', marks: 36}, {subject: '应用数学', marks: 90}, {subject: '英语', marks: 64},]; let initialvalue = { pass: [], fail: []} const groupedresult = result.reduce((accumulator, current) => { (current.marks >= 50) ? accumulator.pass.push(current) : accumulator.fail.push(current); return accumulator;}, initialvalue); console.log(groupedresult);
输出
{ pass: [ { subject: ‘化学’, marks: 59 }, { subject: ‘应用数学’, marks: 90 }, { subject: ‘英语’, marks: 64 } ], fail: [ { subject: ‘物理’, marks: 41 }, { subject: ‘高等数学’, marks: 36 } ]}
5.删除数组中的重复项在下面的代码片段中，删除了 plicatedarr 数组中的重复项。首先，将一个空数组分配给累加器作为初始值。accumulator.includes() 检查 duplicatedarr 数组的每个元素是否已经在累加器中可用。如果 currentvalue 在累加器中不可用，则使用 push() 将其添加。
const duplicatedsarr = [1, 5, 6, 5, 7, 1, 6, 8, 9, 7]; const removeduplicatedarr = duplicatedsarr.reduce((accumulator, currentvalue) => { if(!accumulator.includes(currentvalue)){ accumulator.push(currentvalue); } return accumulator;}, []); console.log(removeduplicatedarr);// [ 1, 5, 6, 7, 8, 9 ]
总结在本文中，我们讨论了数组 reduce() 方法。首先介绍 reduce() 方法，然后，使用一个简单的示例讨论其行为。最后，通过示例讨论了 reduce() 方法最常见的五个用例。如果你是javascript的初学者，那么本文将对你有所帮助。
英文原文地址：https://medium.com/javascript-in-plain-english/5-use-cases-for-reduce-in-javascript-61ed243b8fef
作者：wathsala danthasinghe
更多编程相关知识，请访问：编程视频！！
以上就是通过示例来了解js reduce()方法的5个使用方法的详细内容。