filter,map,reduce三个数组高阶函数的使用
Posted jcdxh
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了filter,map,reduce三个数组高阶函数的使用相关的知识,希望对你有一定的参考价值。
filter ,map ,reduce三个高阶函数的使用
普通方法解决数据问题
const nums1= [10,20,111,222,444,40,50] // 需求1.取出小于100的数字 // 常规思想,用一个数组保存取出的数字,遍历里面的项,小于100的追加进新数组 let newNums = [] for(let n of nums1){ if(n<100){ newNums.push(n) } } console.log(newNums) // 需求2.再将所有小于100的数字进行转化:全部乘2 let newNums2 = [] for(let n of newNums){ newNums2.push(n*2) } console.log(newNums2) // 需求3.再将所有数据相加 let total =0 ; for(let n of newNums2){ total +=n } console.log(total);
- 经过三次创建新数组和对数组的操作拿到了最终想要的数据
引入三个高阶函数
const nums2 = [10,20,111,222,444,40,50] // filter (数组数据过滤) // arr.filter( callbackfn(n) ) ->回调函数有一个要求,必须返回一个boolean值 // 回调函数中的参数n会依此拿arr数组中的每一项 // 当返回true的时候,函数内部会自动将这次回调的n加入到新的数组中 // 当返回的false的时候,函数内部会过滤这次的 let new1 = nums2.filter(function(n){ return n < 100 }) console.log(new1); // map (数组数据变异) // arr.map( callbackfn(n) ) ->回调函数与filter不同,有返回值,但是不是boolean值 // 每次返回的值都作为内部创建的数组的项依此添加进去 let new2 = new1.map(function(n){ return n*2 }) console.log(new2); // reduce (数组数据汇总(相乘,相加)) // arr.reduce( callbackfn (preValue , n) , num ) // preValue上一次返回的值,n为调用该方法数组的每一项 num为perValue的初始值 let sum = new2.reduce((preValue,n)=>{ return preValue + n },0) console.log(sum);
高阶函数的链式调用
// 链式调用 // 高阶函数的高阶用法:因为这三个函数都会返回一个数组,那我门是不是连续使用此方法 let sum1 = nums2.filter((n)=>{ return n<100 }).map((n)=>{ return n*2 }).reduce((e,n)=>{ return e+n },0) console.log(sum1);
以上是关于filter,map,reduce三个数组高阶函数的使用的主要内容,如果未能解决你的问题,请参考以下文章
Python高阶函数_map/reduce/filter函数