reduce函数

74 阅读2分钟

 今天分享的是reduce函数,大部分用于求和,那么它还有什么用法呢?让我们一起来看一看把!

reduce方法

arr.reduce(function(accumulator,currentValue,currentIndex,arr),initialValue));

accumulator:累加器,必需

currentValue:当前值,必需

currentIndex:正在处理的数组元素的索引,可选

arr:要处理的数组,源数组,可选

initialialValue初始值,相当于累加器的初始值,无init累加器为0,有Init累加器的值就是这个值。

案例

1. 数组求和 无init

let arr = [1,2,3,4,5,6]
const sum = arr.reduce((prev,cur,index,arr) =>{         
   console.log('prev',prev,'cur',cur,'index',index);         
   return prev +cur;      
  })console.log(sum,'sum');

数组求和 init =2

let arr = [1,2,3,4,5,6]       
const sum = arr.reduce((prev,cur,index,arr) =>{            
     console.log('prev',prev,'cur',cur,'index',index);            
     return prev +cur;        
},2)
console.log(sum,'sum');

init=2,代表prev的初始值是2

2. 计算数组中每个元素出现的个数

let arr = [1,2,3,4,2,1];
let newArr = arr.reduce((res,cur)=>{
   res[cur]? res[cur]++ :res[cur]=1
   return res;
},[]);

console.log(newArr); 

3. 求最大值

let arr = [122,134,12,2];
let max = arr.reduce((pre,cur,index,arr)=>{
    return pre>cur ? pre:cur
})

4. 将字符串转为数字

let str = '43214';
let str1 = str.split('')      //得到 ['4', '3', '2', '1']
.map(item =>{return item.charCodeAt()-48 })// 得到 [4, 3, 2, 1]

item.charCodeAt()返回字符串中指定索引的字符的Unicode码点。然后,-48将Unicode码点减去48,使其转换为0到9之间的数字。

5. 字符串/单词统计

let str = 'aaabbsc';
str.split('').reduce((res,cur)=>{
    res[cur]?res[cur]++ : res[cur]=1
    return res;
},{})    //return  {a:3 ,b:2,s:1,c:1}

初始值为空对象,运行7次,对象  res[a] 等同于 res.a

第一次,检查res.a 是不是有值,res.a 没有值,undefined的状态,所以赋值为1;

第二次,res.a == 1 ,有值,走res[a] ++ ,res.a == 2;

以此类推

6. 数组去重

let arr = [1,2,3,2,1];
let newArr = arr.reduce((pre,cur)=>{
    if(!pre.includes(cur)){
     return pre.concat(cur);
    }else{
      return pre;
    }
},[]);

newArr初始值为空数组,运行5次

第一次:[ ]里有没有1 ,没有就推进去,有就返回原数组,以此类推。

let arr = [[0, 1], [2, 3], [4, 5]]      // 二维数组
let newArr = arr.reduce((pre,cur) => {
    console.log(cur)                     // 每次输出都是一个数组
    return pre.concat(cur)              // 合并pre 与 cur, 并返回一个新数组
},[])
console.log(newArr);  

arr数组里有三个元素,每一个元素都是一个数组,运行三个

第一次,累加器是空数组,cur 为[0,1],   合并数组

第二次,累加器是[0,1],cur 为[2,3], 合并数组

第二次,累加器是[0,1,2,3],cur 为[4,5], 合并数组,为[0,1,2,3,4,5];

参考链接

CDN
JS进阶篇--JS数组reduce()方法详解及高级技巧