JS数组中的map()、filter()以及reduce()的基本使用

这篇博客深入探讨了JavaScript中的数组方法filter、map和reduce的使用。通过实例展示了如何筛选小于100的元素,将其乘以2并求和。同时,文章也提供了使用箭头函数的简洁写法。这三种方法的组合使用,为数组处理提供了强大的功能。
摘要由CSDN通过智能技术生成
<script>
        // filter中的回调函数有一个要求:必须返回一个boolean值
        // true:当返回true时,函数内部会自动将这次回调的n加入到新的数组中
        // false:当返回false时,函数内部会过滤掉这次的n
        const nums = [10,20,111,222,444,40,50];

        // 1. filter函数的使用
        
        let newNums = nums.filter(function(n){
            return n<100
        })

        console.log(newNums);// 10 20 40 50

        // 2. map函数的使用
        
        let new2Nums = newNums.map(function(n){
            return n*2
        })
        console.log(new2Nums);// 20 40 80 100

        // 3.reduce函数的使用
        // reduce作用对数组中所有的内容进行汇总
        let total = new2Nums.reduce(function(preValue,n){
            return  preValue + n
        },0)
        // 这里的 0 ,是寄给preValue的初始值 

        // 第一次: preValue:0      n:20
        // 第2次:  preValue:0+20   n:40
        // 第3次:  preValue:20+40  n:80
        // 第4次:  preValue:140    n:100
        // 240

        console.log(total);


        // 三种方法汇总使用
        // 目的:扫选出数组中小于100的值,并将符合的值 * 2 , 再累加
        let goal = nums.filter(function(n){
            return n<100
        }).map(function(n){
            return n*2
        }).reduce(function(preValue,n){
            return preValue + n;
        },0)

        console.log(goal);

        // 以上方法若用箭头函数简写

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

执行结果:
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值