在用vue.js开发过程中为了使代码不那么复杂化,我们常常需要记住一些js中高阶函数的用法,这里推荐3中高阶函数的用法:filter,map,reduce
这里用一个小栗子来记录一下:
const nums = [12, 23, 22, 18, 100, 67, 48, 88]
需求1:对数组进行遍历筛选小于50的数字,如果不用高阶函数的话,我们可能需要非常冗长的代码来完成这样的需求
如上,这样写还不能对新数组进行排序,非常的复杂冗长,所以引入了我们的高阶函数filter(后面的长代码就不一一列举了!!实在太难写了基本上都是换汤不换药的类型)
filter:回调函数的返回值为true时将回调函数参数的值放入新数组
而如果用高阶函数使用的话就仅需用一行代码来完成这个需求
这里对filter函数的参数进行解释:从filter函数的定义(这里就不列举filter的定义了)来说,他的参数必须是一个函数,函数内需要有形参n,然后在函数内部return表达式
2.对数组的每个参数进行*2
这里用高阶函数中的map函数。
map:对数组对象中的值进行操作,将操作后的数放入新数组
话不多说,直接上代码。
map函数的用法参考filter
3.对数组中的所有参数进行相加。
reduce函数:对数组中所以内容进行汇总
这里对reduce函数进行解释:
同意reduce方法需要传入的参数也为一个函数,但函数内部需要两个形参,此处用preValue和n来表示,然后再返回两个参数相加得到的值(参数的具体意义突然搞忘了,所以此处不敢妄加解释)。
二.三个方法间的混合使用
用箭头函数再次简写可以写为:
请朋友们自行理解...