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