媒介
这几天口试被问到了数组的要领有哪些,回复得几乎一塌糊涂,口试官说reduce的功用很壮大,因而想对这个要领举行总结,在红宝书中对这个要领的形貌并不算多,我也是参考了其他文章才举行总结的,下面就最先吧~
reduce的原理
简介
在红宝书中,将这个要领定义为数组的合并要领,这个要领和迭代要领(map,forEach,filter…)一样,都邑对数组举行遍历,reduce与他们差别的是函数的第一个参数获得的是迭代盘算后的效果(看不懂没紧要,继承往下看就会懂了)
语法
这个要领吸收两个参数:
要实行的函数,要实行的函数中也可传入参数,分别为
- prev:上次挪用函数的返回值
- cur:当前元素
- index:当前元素索引
- arr:被遍历的数组
- 函数迭代的初始值
举例
- 没有设置函数的初始迭代值
let arr = [1, 2, 3, 4];
let sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
})
console.log(arr, sum);
运转效果:
剖析:
我们能够看到,在这里reduce的作用就是对这个数组举行乞降,迭代了3次,函数迭代的初始值是1,也就是默认值(数组的第一项),prev的值是每次盘算后的值,如今明白了吧!
- 设置初始迭代值
let arr = [1, 2, 3, 4];
let sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
},5)
console.log(arr, sum);
运转效果:
剖析:
这里我们增加了一个初始的迭代值,也就是让prev从5最先盘算,能够看到,这里迭代了4次,效果也加上了初始值。
reduce的运用
低级运用
最常见的运用平常就是乞降以及求乘积了,比方说下面的例子:
let arr = [1,2,3,4,5]
console.log(arr.reduce((a,b) => a + b))//15
console.log(arr.reduce((a,b) => a * b))//120
高等运用
盘算数组中每一个元素涌现的次数
let arr = ['name','age','long','short','long','name','name']
let arrResult = arr.reduce((pre,cur) =>{
console.log(pre,cur)
if(cur in pre){
pre[cur]++
}else{
pre[cur] = 1
}
return pre
},{})
console.log(arrResult)//效果:{name: 3, age: 1, long: 2, short: 1}
运转效果:(第一个console.log)
剖析:
也许的解释一下,运转历程是如许的:
- 因为设置了迭代初始值,pre的第一个值是一个空对象,此时cur为name,然后举行推断,发如今pre中没有name属性,所以就将name对应的属性值赋为1;
- 背面没有反复的是一样的原理,假如遇到反复值,就会将该属性值加1,如许就可以盘算元素反复的次数了。(有无以为很奇异呀~)
去除数组中反复的元素
let arrResult = arr.reduce((pre,cur) =>{
if(!pre.includes(cur)){
pre.push(cur)
}
return pre;
},[])
console.log(arrResult)//效果:["name", "age", "long", "short"]
剖析:
这里主如果借助迭代功用完成数组的扩大,推断当前元素是不是已增加到数组中,假如不存在就从尾部增加,这个要领在去主要领中应该算比较简单高效的。
对对象的属性乞降
let person = [
{
name: 'xiaoming',
age: 18
},{
name: 'xiaohong',
age: 17
},{
name: 'xiaogang',
age: 19
}
]
let result = person.reduce((a,b) =>{
a = a + b.age;
return a;
},0)
console.log(result)//效果:54
剖析:
这里主要就是应用reduce第一个参数是迭代,能够经由过程初始化这个参数的数据类型,到达想完成的效果。
总结
运用reduce操纵数组时,最主要的就是明白第一个参数是怎样迭代的,能够好好应用初始化这个参数的数据类型来削减许多不必要的代码。上面举的三个高等运用的例子都是应用了这个长处,固然,reduce另有更多的运用,背面遇到还会举行补充的。
假如以为有效就给个赞吧~