reduce()方法对数组中的每个元素执行一个reducer函数（由您提供），从而产生单个输出值。reduce()方法将数组中的所有元素缩减为单个输出值，可以是数字、对象或字符串。reduce()方法有两个参数，第一个是回调函数，第二个是初始值。回调函数回调函数在数组的每个元素上执行。回调函数的返回值是累加的结果，作为下次回调函数调用的参数提供。回调函数有四个参数。累加器-累加器累加回调函数的返回值。当前值-处理数组的当前元素。当前索引-处理数组当前元素的索引。SourceArray（源数组）CurrentIndex和SourceArray是可选的。initialValue如果指定了initialValue，则将累加器设置为initialValue作为初始元素。否则，将累加器设置为数组的第一个元素作为初始元素。arr.reduce(callback(accumulator,currentValue[,index[,array]])[,initialValue])在下面的代码片段中，第一个累加器被赋予初始值0。currentValue是正在处理的numbersArr数组的元素.在这里，currentValue被添加到累加器中，下次调用回调函数时，返回值作为参数提供。constnumbersArr=[67,90,100,37,60];consttotal=numbersArr.reduce(function(accumulator,currentValue){console.log("accumulatoris"+accumulator+"currentvalueis"+currentValue);returnaccumulator+currentValue;},0);console.log("总计："+总计);输出accumulatoris0currentvalueis67accumulatoris67currentvalueis90accumulatoris157currentvalueis100accumulatoris257currentvalueis37accumulatoris294currentvalueis60total:354JavaScriptreduceCase1.Sumallvaluesofanarray结果在下面的代码中有5个数字。使用reduce()方法，将数组缩减为单个值，将studentResult数组的所有值和结果赋值给total。conststudentResult=[67,90,100,37,60];consttotal=studentResult.reduce((accumulator,currentValue)=>accumulator+currentValue,0);console.log(total);//3542.对象数组中值的总和通常，我们从后端获取数据作为对象数组，因此reduce()方法有助于管理我们的前端逻辑。在下面的代码中，studentResult对象数组中有三个科目，这里currentValue.marks取studentResult对象数组中每个科目的分数。conststudentResult=[{subject:'数学',marks:78},{subject:'物理',marks:80},{subject:'化学',marks:93}];consttotal=studentResult.reduce((累加器,currentValue)=>累加器+currentValue.marks,0);console.log(total);//2513.扁平化数组“扁平化数组”是指将多维数组转换为一维数组。在下面的代码中，twoDArr二维数组被转换为oneDArr一维数组。在这里，第一个[1,2]数组被分配给累加器，然后twoDArr数组的每个剩余元素都连接到累加器。consttwoDArr=[[1,2],[3,4],[5,6],[7,8],[9,10]];constoneDArr=twoDArr.reduce((accumulator,currentValue)=>accumulator.concat（当前值））;console.log(oneDArr);//[1,2,3,4,5,6,7,8,9,10]4.按属性对对象进行分组根据对象的属性，我们可以使用reduce()方法将对象数组分成组。通过以下代码片段，您可以清楚地理解这个概念。在这里，结果对象数组有五个对象，每个对象都有subject和marks属性。如果分数大于或等于50，则该主题通过，否则，该主题不合格。reduce()用于将结果分组为通过和失败。首先，将initialValue分配给累加器，然后push()方法在检查条件后将当前对象作为对象数组添加到pass和fail属性中。constresult=[{subject:'物理',marks:41},{subject:'化学',marks:59},{subject:'高等数学',marks:36},{subject:'应用数学',marks:90},{subject:'English',marks:64},];letinitialValue={pass:[],fail:[]}constgroupedResult=result.reduce((accumulator,current)=>{(current.marks>=50)?accumulator.pass.push(current):accumulator.fail.push(current);returnaccumulator;},initialValue);console.log(groupedResult);输出{pass:[{subject:'Chemistry',marks:59},{subject:'应用数学',marks:90},{subject:'英语',marks:64}],fail:[{subject:'物理',marks:41},{subject:'高等数学',marks:36}]}5.从数组中删除重复项在以下代码片段中，删除了replicatedArr数组中的重复项。首先，一个空数组被分配给累加器作为初始值。accumulator.includes()检查duplicatedArr数组的每个元素是否已在累加器中可用。如果currentValue在累加器中不可用，则使用push()添加它。constduplicatedsArr=[1,5,6,5,7,1,6,8,9,7];constremoveDuplicatedArr=duplicatedsArr.reduce((accumulator,currentValue)=>{if(!accumulator.includes(currentValue)){accumulator.push(currentValue);}returnaccumulator;},[]);console.log(removeDuplicatedArr);//[1,5,6,7,8,9]总结在本文中，我们讨论了数组的reduce()方法。首先介绍reduce()方法，然后使用一个简单示例讨论其行为。最后，通过示例讨论了reduce()方法的五个最常见用例。如果您是JavaScript的初学者，那么本文将对您有所帮助。本文转载自微信公众号“前端全栈开发者”，可通过以下二维码关注。转载本文请联系前端全栈开发公众号。
