JavaScript中必懂的三个高阶函数!!!

filter

过滤函数,filter用于对数组进行过滤。
它创建一个新数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
filter中的回调函数必须返回一个boolean值,为true时则将回调的值添加到新数组中,为fasle时则过滤掉
filter()不会对空数组进行检测、不会改变原始数组

语法:

Array.filter(function(currentValue, indedx, arr), thisValue)

map

map返回一个新的数组，数组中的元素为原始数组调用函数处理后的值。
map()不会对空数组进行检测、不会改变原始数组

语法:

Array.map(function(currentValue, indedx, arr), thisValue)

reduce

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
reduce()不会对空数组进行检测、不会改变原始数组

语法:

Array.reduce(callback,[initialValue])

reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用 reduce 的数组 高级使用.

callback （执行数组中每个值的函数，包含四个参数）

    1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））
    2、currentValue （数组中当前被处理的元素）
    3、index （当前元素在数组中的索引）
    4、array （调用 reduce 的数组）
    
initialValue （作为第一次调用 callback 的第一个参数。）

示例

现有数组: [10,20,111,222,444,40,50]

• 需求1: 取出所有小于100的数字
• 需求2:将所有小于100的数字进行转换: 全部*2
• 需求3:将需求1和2得到新数组里面的值全部相加,得到最终结果

      const nums = [10, 20, 111, 222, 444, 40, 50];
      //需求1: 取出所有小于100的数字
      let newnums1 = nums.filter(function (n) {
        return n < 100;
      });
      //需求2:将所有小于100的数字进行转换: 全部*2
      let newnums2 = newnums1.map(function(n){
        return n*2
      })
      //需求3:将需求1和2得到新数组里面的值全部相加,得到最终结果
      let newnums3 = newnums2.reduce(function(preValue,n){
          return preValue + n
      },0)
  
      //来整合一下,再用上箭头函数,一句代码搞定三个需求,是不是很简洁了呢
      let newnums = nums.filter(n => n < 100).map(n => n * 2).reduce((pre,n) => pre + n);