ES6中的数组reduce()方法
reduce() 方法对数组中的每个元素执行一个由我们提供的reducer函数(升序执行),将其结果汇总为单个返回值.
arr.reduce(callback,[initialValue])
reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组。
callback (执行数组中每个值的函数,包含四个参数)
initialValue (作为第一次调用 callback 的第一个参数。)
————————————————
版权声明:本文为CSDN博主「大象与小蚂蚁的生活」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/seimeii/article/details/121614775
1、reduce是什么 不改变原数组学习网站reduce() 方法对数组中的每个元素执行一个由我们提供的reducer函数(升序执行),将其结果汇总为单个返回值.arr.reduce(callback,[initialValue])reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组。callback (执行数组中每个值的函数,包含四个参数)initialValue (作为第一次调用 callback 的第一个参数。)12342、reduce参数reduce / reduceRight(fn(prev, cur), defaultPrev): 两两执行,prev 为上次化简函数的return值,cur 为当前值(从第二项开始)
数组方法 reduce 用来迭代一个数组,并且把它累积到一个值中。
使用 reduce 方法时,你要传入一个回调函数,这个回调函数的参数是一个 累加器 (比如例子中的 previousVal) 和当前值 (currentVal)。
reduce 方法有一个可选的第二参数,它可以被用来设置累加器的初始值。如果没有在这定义初始值,那么初始值将变成数组中的第一项,而 currentVal 将从数组的第二项开始。
1、previousValue (上一次调用回调返回的值,或者是提供的初始值(initialValue)) 2、currentValue (数组中当前被处理的元素) 3、index (当前元素在数组中的索引) 4、array (调用 reduce 的数组)
123453、使用 reduce 方法来让 array 中的所有值相加<!DOCTYPE html><html><head><meta charset="utf-8"><title>reduce的使用</title></head><body> <script>var arr = [1, 2, 3, 4, 5];sum = arr.reduce(function(prev, cur, index, arr) { //输出的是第一项的值或上一次叠加的结果,正在被处理的元素,正在被处理的元素的索引值 console.log(prev, cur, index); return prev + cur;})console.log(arr, sum); //输入数组本身和最后的结果</script></body></html>12345678910111213141516171819控制台输出:
4、reduce封装成函数调用 让数组里面的值相加var numbers = [15.5, 2.3, 1.1, 4.7];
// total是初始值 为0 之后为每次累加的和// num为数组的每一项//Math.round(num)四舍五入函数function getSum(total, num) { return total + Math.round(num);}function myFunction(item) { console.log(numbers.reduce(getSum, 0));//0 传递给函数的初始值}myFunction()//输出24123456789101112
5、reduce简单用法let arr1 = [1,2,3,4,5] //求和 let sum=arr1.reduce((pre,item)=>{ return pre + item },0) //累加初始值0可以不给 不影响效果 console.log('sum=',sum); //15 //求积 let mul = arr1.reduce((x,y)=>{ return x*y }) console.log('mul=',mul) //120
1234567891011126、数组中元素出现的次数let name=[1,5,2,1,6,5,1,2,4,2,4,3,5,6]; let nameNum = name.reduce((pre,item)=>{ if(item in pre){ pre[item] ++ }else{ pre[item]=1 } return pre },{}) console.log('次数',nameNum) //{1: 3, 2: 3, 3: 1, 4: 2, 5: 3, 6: 2}
12345678910117、reduce数组去重let name=[1,5,2,1,6,5,1,2,4,2,4,3,5,6]; let newArr=name.reduce((pre,item)=>{ if(!pre.includes(item)){ return pre.concat(item) }else{ return pre } },[]) console.log('newArr',newArr) //[1,5,2,6,4,3]
12345678910quchong(){ /** * indexof()检索该值在数组中是否存在,不存在返回-1 */ let arr=[]; this.arr1.forEach((item)=>{ if(arr.indexOf(item)=== -1){ arr.push(item) } }) return arr;}
123456789101112138、将二维数组转化为一维数组let cat=[[1,2],[2,3],[3,4],[4,5]];let newCat=cat.reduce((pre,item)=>{return pre.concat(item)},[])console.log(‘二维’,newCat) //[1,2,2,3,3,4,4,5]
1234569、多维数组转化为一维let drunk=[[0,1],[1,2],[1,[1,2,3,4],5]];let newDrunk=function(drunk){return drunk.reduce((pre,item)=>pre.concat(Array.isArray(item)?newDrunk(item):item),[])}console.log(‘多维’,newDrunk(drunk)) //[0,1,1,2,1,1,2,3,4,5]
12345610、对象中的属性求和let result=[{subject:‘math’,score:10},{subject:‘math’,score:10},{subject:‘math’,score:10}]let total = result.reduce(function(pre,item){return pre+item.score},0)console.log(‘分数和:’,total) //30
12345678910111213141511、将对象中的某个字段的值拼接为字符串var arr=[{name:'测试一',value:1},{name:'测试二',value:2},{name:'测试三',value:3},{name:'测试四',value:4}]
function objectOfStr(){let arr1=[];let str = this.arr.reduce((pre,item)=>{return arr1.push(item.value)},[]);arr1 = arr1.join()return arr1;}objectOfStr()
// 输出为'1,2,3,4'123456789101112131415161718192021222324252612、将[1,3,1,4]转为数字1314function addDigitValue(prev,curr,curIndex,array){ var exponent = (array.length -1) -curIndex; var digitValue = curr*Math.pow(10,exponent); return prev + digitValue; } var arr6 = [1,3,1,4]; var result7 = arr6.reduce(addDigitValue,0) console.info('result7',result7)————————————————版权声明:本文为CSDN博主「大象与小蚂蚁的生活」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。原文链接:https://blog.csdn.net/seimeii/article/details/121614775