案例之高阶函数

一:普通的for循环

通过这个素组有三个需求

//1.需求:取出所有小于100的数字
  const nums = [10,20,111,222,444,40,5]
  let newNums = []
  for(let n of nums){
      if(n<100){
          newNums.push(n)
      }
  }
//2.将所有小于100的数字进行转化: 全部*2
  const nums = [10,20,111,222,444,40,5]
    let new2Nums = []
    for(let n of newNums){
        new2Nums.push(n*2)

    }
    console.log(new2Nums)

第一个和第二个需要一个空数组来添加求出来之后的数
第三个需要声明一个为0的变量来计算结果

  // 3.需求:将所有new2nums数字相加,得到最终的结果
const nums = [10,20,111,222,444,40,5]
let total = 0;
    for(let n of new2Nums){
        total += n
    }
console.log(total);

二:高阶函数是ES6里的内容

通过以下三个高阶函数方法将上面三个for循环简单化

filter/map/reduce
filter中的回调函数有一个要求: 必须返回一个boolean值
true: 当返回true时, 函数内部会自动将这次回调的n加入到新的数组中
false: 当返回false时, 函数内部会过滤掉这次的n

/ 1.filter过滤函数的使用
  const nums = [10,20,111,222,444,40,5]
 let newNums = nums.filter(function(n){
    // return true
     return n<100
  })
console.log(newNums);
// 2.map映射函数的使用
  const nums = [10,20,111,222,444,40,5]
let new2Num = newNum.map(function (n){
    return n*2
})
    console.log(new2Nums);//值是20,40,80,100
// 3.reduce函数的使用(这个比较难)
 //reduce 作用对数字中所有的内容进行汇总
  const nums = [10,20,111,222,444,40,5]
  let total = new2Nums.reduce(function (preValue,n){
        return preValue + n
    },0)

  //根据回调函数一共调用四次
// 第一次: preValue 0    n 20    //第一次preValue 初始化值是0 ,n的值还是遍历的第一个值
// 第二次:preValue 20   n 40    //第二次preValue 值是上一次的值加上一次n的值  n的值还是遍历的第二个值
// 第三次:preValue 60   n 80    // 第三次preValue 值是上一次的值加上一次n的值,n的值还是遍历的第三个值
//第四次:preValue 140   n 100    // 第四次preValue 值是上一次的值加上一次n的值,n的值还是遍历的第四个值

三:将高阶函再简单化

第二的里面的案例,高阶函数可以进行连接得到的结果是相同的,实现再简单化

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

四:箭头函数式写法

更简洁的写法

const nums = [10,20,111,222,444,40,50]
    let total = nums.filter(n=> n<100).map(n=>n*2).reduce((pre,n)=>pre+n);
    console.log(total);
  • 30
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 34
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 34
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值