首页 > 编程语言 > 详细

JavaScript高阶函数filter、map、reduce学习

时间:2021-04-21 10:13:34      阅读:22      评论:0      收藏:0      [点我收藏+]

JavaScript高阶函数filter、map、reduce学习

<script>
       const nums=[10,20,50,100,130,250,25,45];
    //问题:将所有小于100的数字乘2之后相加,打印最终结果

    /*方式一:for..of*/
    let newNums=[];
    let total=0;
    for(let n of nums){
        if(n<100){
            newNums.push(n*2);//将所有小于100的数字放入空数组newNums中
        }
    }
    for(let n of newNums){
        total+=n;
    }
    console.log("for..of方法的结果:"+total);

    /*方式二:JavaScript高阶函数filter、map、reduce*/    
    let filterNums = nums.filter(
        /*此处运用了箭头函数: 参数 => 返回值,简化了原函数写法
        function(n){
            return n<100
        }
        */
        n => n<100 
    )//filter中的回调函数有一个要求,必须返回一个Boolean值,满足小于100的为true,放入filterNums中
    //console.log(filterNums);

    let mapNums = filterNums.map(
        n => n*2 
    )//map函数将每个值乘2映射到mapNums中
    //console.log(mapNums);


    let total2 = mapNums.reduce(
        (preValue,n) => preValue+n 
    ,0)//reduce对数组中的所有内容进行汇总,preValue初始值为0
    console.log("高阶函数filter、map、reduce使用所得的结果:"+total2);



    //链式编程练习
    let total3=nums.filter(n => n<100).map(n => n*2).reduce((pre,n) => pre+n,0)
    console.log("高阶函数链式的结果:"+total3);


   </script>

控制台结果为:

for..of方法的结果:300
高阶函数filter、map、reduce使用所得的结果:300
高阶函数链式的结果:300

JavaScript高阶函数filter、map、reduce学习

原文:https://www.cnblogs.com/jiehao-yu/p/14683300.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!