JS数组reduce()⽅法详解
reduce() ⽅法接收⼀个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为⼀个值。
reduce() 可以作为⼀个⾼阶函数,⽤于函数的 compose。
注意: reduce() 对于空数组是不会执⾏回调函数的。
⾸先我们看⼀下参数initialValue:
// 当没有设置初始值
let arr = [1,3,4,6,7]
let sum = duce((total,current,index)=>{
console.log(index, current, total);
return total+current
})
console.log(sum, '求和')
可以看出当没有设置initialValue的时候,可以看出total取值是arr[0](即数组下标为0的数值默认成initialValue)从数组的下标1开始遍历。
// 当有设置初始值
let arr2 = [1,3,4,6,7]
let sum2 = duce((total,current,index)=>{
console.log(index, current, total);
return total+current
},10)
console.log(sum2, '求和')
可以看出当设置initialValue的时候,从数组下标为0的开始遍历。
reduce()的简单⽤法:
1、reduce()最简单的⽤法就是累加和累乘
// 累加和累乘
let arr3 = [1,3,4,6,7];
let sum3 = duce((pre,cur)=> pre+cur)
let multiply = duce((pre,cur) => pre*cur)
console.log(sum3) // 21
console.log(multiply) // 504
reduce()的⾼级⽤法:
1、数组去重
// 数组去重
let arr4 = [1,3,2,5,3,1,2,7,8];
let newArr = duce((pre,cur)=>{
if(!pre.includes(cur)){
at(cur)
} else {
return pre
}
},[]);
console.log(newArr, '数组去重') // [1, 3, 2, 5, 7, 8]
2、将⼆维数组转换成⼀维数组
// 将⼆维数组转换成⼀维数组
let arr5 = [[1,2],[3,4],[5,7]];
let newArr2 = duce((pre,cur)=>{
at(cur)
},[]);
console.log(newArr2, '⼆维转成⼀维') // [1, 2, 3, 4, 5, 7]
3、将多维数组转成⼀维数组
// 将多维数组转换成⼀维数组
let arr6 = [1,3,[4,5,6,[7,8,4]],[7,0,[2,4],9]];
let newArr3 = this.flatArr(arr6);
console.log(newArr3, '多维转⼀维') // [1, 3, 4, 5, 6, 7, 8, 4, 7, 0, 2, 4, 9]
flatArr(arr){
duce((pre,cur)=>{
at(Array.isArray(cur)?this.flatArr(cur):cur)
},[])
}
4、操作对象数组中的对象属性
const data = [
{
id:1,
name:'安徽'js数组方法总结
},
{
id:2,
name:'南京'
},
{
id:3,
name:'上海'
},
{
id:4,
name:'杭州'
},
{
id:5,
name:'天津'
},
{
id:6,
name:'北京'
},
{
id:7,
name:'⼭东'
},
{
id:8,
name:'河南'
},
{
id:9,
name:'重庆'
},
{
id:10,
name:'成都'
},
{
id:11,
name:'合肥'
},
]
const city_list = duce((prev, item, idx) => {      let key =
idx > 8
`${idx + 1}00`
: `0${idx + 1}00`;
prev[key] = item.name;
return prev;
}, {});
console.log(city_list, '转换后的城市列表')
// 操作对象数组中的对象属性
let person = [
{
name:'⼩红',
age:16,
},
{
name:'⼩黄',
age:20,
},
{
name:'⼩⿊',
age:21,
},
]
let sumAge = duce((pre,cur)=>{
return pre = pre+cur.age
},0);
console.log(sumAge) // 57
5、计算数组中每个元素出现的次数
// 计算数组中每个元素出现的次数
let arr7 =['红','黄','⿊','黄','蓝','红']
let num = duce((pre,cur)=>{
if(cur in pre){
pre[cur]++
}else {
pre[cur] = 1
}
return pre
},{})
console.log(num,'num对象') //{红: 2, 黄: 2, ⿊: 1, 蓝: 1}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。