Day17——JavaSrcipt高阶函数的使用

一时失言乱红尘 2023-02-27 12:22 60阅读 0赞

### 文章目录 ###

*  一. 回顾
 *  二. JavaSrcipt高阶函数

# 一. 回顾 #

前面写了一个[Day16——书籍购物车案例][Day16]，今天学习JavaSrcipt高阶函数

# 二. JavaSrcipt高阶函数 #

直接结合例子讲解，注意注释中的阐述都是高阶函数的作用，如下：

//编程范式：命令时编程，函数时编程
    //编程范式：面向对象编程（第一公民：对象）/函数式编程（第一公民：函数）
    //使用filter/map/reduce,函数式编程
    
    const num = [100, 20, 40, 12, 43, 50, 88, 85];
    
    /** * 更加简洁的写法，使用lambda表达式,语法:(...params) => (operation) */
    let numNums4 = num.filter( n => n < 50).map( n => n * 2).reduce( (prevalue, n) => (prevalue + n), 0);
    console.log(numNums4);
    
    //------------------------------------------------
    /** * filter/map/reduce三者综合使用起来如下： */
    let nuNums3 = num.filter(function (n) { 
      return n < 50;
    }).map(function (n) { 
      return n * 2;
    }).reduce(function (prevalue, n) { 
      return prevalue + n;
    }, 0);
    
    
    //-----------------------------------------------
    /** * 1. filter的使用 * filter中的回调函数有一个要求，必须返回一个boolean值， * 返回true时，函数内部会将回调的n加入到新的数组中； * 返回false时，函数内部则自动过滤掉。 * @type {number[]} */
    let newNums = num.filter(function (n) { 
      return n < 50;
    })
    
    /** * 2. map的使用 * map的回调函数对拿到的n做处理，然后添加到数组中 */
    let newNums2 = newNums.map(function (n) { 
      return n * 2;
    })
    
    /** * 3. reduce的使用 * 它的作用是对数组中所有的内容进行汇总。 * reduce函数有2个形参，第一个参数是一个函数。 * 第一个参数中也有2个参数：其中第一个是上一次遍历得到的结果值，初始值是由reduce的第二个参数决定； * 第二个参数是数组中元素的值 */
    let total = newNums2.reduce(function (prevalue, n) { 
      return prevalue + n;
    }, 0)
    console.log(total);
    
    //--------------------------------------------
    
    //下面这种做法太过繁琐
    /* //需求1：取出所有小于50的数字 let newNum = []; for(let n of num){ if(n < 50){ newNum.push(n); } } //需求2：将所有小于50的数字分别乘以2 let newNum2 = []; for(let n of newNum){ newNum2.push(n * 2); } //需求3：将newNum2所有数字相加，得到最终结果 let result = 0; for(let n of newNum2){ result += n; } */

[Day16]: https://blog.csdn.net/qq_40634846/article/details/107411406