zoukankan      html  css  js  c++  java
  • filter,map,reduce三个数组高阶函数的使用

    filter ,map ,reduce三个高阶函数的使用

    普通方法解决数据问题

    1.  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);
      
    2. 经过三次创建新数组和对数组的操作拿到了最终想要的数据

    引入三个高阶函数

    1.     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);
      
      

    高阶函数的链式调用

    1.  // 链式调用
       // 高阶函数的高阶用法:因为这三个函数都会返回一个数组,那我门是不是连续使用此方法
         let sum1 = nums2.filter((n)=>{
           return n<100
         }).map((n)=>{
           return n*2
         }).reduce((e,n)=>{
           return e+n
         },0)
         console.log(sum1);
      
  • 相关阅读:
    QT资料大全
    网络协议及tcp协议详解
    QT和Java的跨平台
    QString转char *
    QT删除整个文件夹
    QT获取linux下的当前用户名
    std::map自定义类型key
    QT程序自启动
    linux下通过命令连接wifi
    Rsync实现文件的同步
  • 原文地址:https://www.cnblogs.com/JCDXH/p/11745153.html
Copyright © 2011-2022 走看看