JS高阶函数

Posted 爱代码三千

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS高阶函数相关的知识,希望对你有一定的参考价值。

JS高阶函数-遍历方法

filter()

filter方法检查数组,删除不匹配的元素,返回一个新数组

  • filter方法内部传入回调函数,回调函数要求必须传入数组的value
    const arr = [1,2,3,4];
    let newArr = arr.filter(function(n){
        return n<3;
    })
    console.log(newArr)//1,2


map()

map方法遍历并处理数组中每个元素,并返回一个新数组

回调函数中传入的值为数组的value

    const arr = [1,2,3,4];
    let newArr = arr.map(function(n){
        return n*2;
    })
    console.log(newArr)//2,4,6,8

forEach()

forEach方法为数组每个元素都执行一次回调函数,将元素传递给回调函数。

forEach和map的却别是没有返回值

    const arr = [1,2,3,4];
    arr.forEach(function(item,index){
        let newArr = index+'-'+item*2;
        console.log(newArr)
    })


reduce()

reduce方法依次处理数组的每个成员,最终累计为一个值。

建议直接用设置初始值的方法
1. reduce方法面对空数组时需要一个初始值,
2. 数组内如果是对象,在没有初始值方法中,第一次遍历previousValue是一个成员需要计算,
而我只想让它返回值。初始值遍历方法则完美解决这个问题

  • 该方法接收的第一个参数为函数,第二个为初始值
  • 函数中又接收两个参数,(之前的返回值,当前值)

    reduce(function(之前的返回值,当前值){},初始值)
  • 没有初始值
  • 函数内参数1为数组第一个成员,参数2为数组第二个成员
  • 第一次遍历时参数1为返回值,参数2为数组依次遍历的值,直到完成

    const arr = [1,2,3,4,5]
    let newArr = arr.reduce(function (preValue,nowValue) {
      return preValue+nowValue;
    })
    console.log(newArr);
    //1 2
    //3 3
    //6 4
    //10 5
    //最后结果15
  • 设置了初始值
  • 第一次遍历初始值与数组第一个成员
  • 第二次遍历时参数1为返回值,参数2为数组依次遍历的值,直到完成
    const arr = [1,2,3,4,5]
    let newArr = arr.reduce(function (preValue,nowValue) {
      return preValue+nowValue;
    },10)
    console.log(newArr);
    //10 1
    //11 2
    //13 3
    //16 4
    //20 5
    //最后结果25


find()

find方法遍历数组,返回符合条件的子元素

内如果判断为true,则返回item。

      const arr = [1,2,3,4]
      let arrItem =  arr.find(function(n){
          return n==2;
      });
      console.log(arrItem);
      //2


every()

every方法用于检测数组内所有元素是否符合条件,返回布尔值

如果数组有一个元素不满足,则整个表达式返回 false,并剩余元素不会再检测

every不会对空数组进行检测
every不会改变原始数组

    const  arr = [1,2,3,4]
    let isTrue = arr.every(function(n){
        return n>2;
    })
    console.log(isTrue);
    //false

以上是关于JS高阶函数的主要内容,如果未能解决你的问题,请参考以下文章

浅谈JS高阶函数

js里常用函数之高阶函数

js 高阶函数 发布订阅观察者模式 手撕promise

理解运用JS的闭包高阶函数柯里化

js函数式编程基础:高阶函数柯理化函数合成Loadash

JS高阶编程技巧--惰性函数