JS高阶函数 filter map reduce

JavaScript权威指南(第7版) P153 - 155 知识点

编程范式:命令式编程/声明式编程
编程范式:面向对象编程(第一公民:对象)/函数式编程(第二公民:函数)

高阶函数 — 一个函数接收另一个函数作为参数的函数

filter() — 过滤

filter中的回调函数有一个要求：必须返回一个Boolean值

• true:当返回true时，函数内部会自动将这次回调的n加入到新的数组中
• false:当返回false时，函数内部会过滤掉这次的n

需求:取出所有小于100的数字

常规写法

const nums = [10,20,111,222,444,40,50];
let newNums =[];
for(let  n of  nums){
  if(n<100){
      newNums.push(n)
     }
   }

高阶函数写法

const nums = [10,20,111,222,444,40,50];
let newNums = nums.filter(function (n) {
    return n<100
   })
   console.log(newNums);

map() — 映射

对n进行处理，返回处理后的n加入到新数组中

需求:将所有小于100的数字进行转化:全部*2

常规写法

let new2Nums=[];
for(let  n of  nums){
   if(n<100){
     newNums.push(n*2)
   }
 }
 console.log(new2Nums);

高阶函数写法

let new2Nums = nums.map(function (n) {
   return n*2
 })
 console.log(new2Nums);

reduce() – 汇总

reduce函数作用 : 对数组中所有内容进行汇总, 至少传两个值

需求:将所有new2Nums数字相加,得到最终的结果

常规写法

let total = 0;
for(let n of new2Nums){
   total += n
 }
 console.log(tatol);

高阶函数写法

new2Nums.reduce(function (preValue,n) {
  return preValue+n
 },0)

第一个参数是执行归并操作的函数,
第二个参数是可选的,是传给归并函数的初始值 , 第二个参数为0
第一次遍历初始化preValue为0 ,此时n为遍历数组中第一个成员即20
第二次遍历 , preValue为上次return的返回值, 此时n为遍历数组中第二个成员即40
…

1. 遍历第一次: preValue :0 ；n :20

2. 遍历第二次: preValue :20 ；n :40

3. 遍历第三次: preValue: 60 ；n :80

4. 遍历第四次: preValue: 140 ；n :100 //240

链式调用

const nums = [10,20,111,222,444,40,50];
let newNums = nums.filter(function (n) {
return n<100
 }).map(function (n) {
   return n*2
 }).reduce(function (preValue,n) {
  return preValue+n
 },0)

箭头函数

 let total = nums.filter(n => n<100).map(n =>n*2).reduce((pre,n)=> pre+n);
  console.log(total)