高阶函数

113 阅读2分钟

何为高阶函数?

在JavaScript中,函数作为第一公民,使用率超级高,函数内部接收一个参数作为变量,那么这个函数就被称为高阶函数,而且正是由于高阶函数,才让JavaScript接受函数式编程。

简单的高阶函数

function add(x, y, f) {
    return f(x) + f(y);
}
//当调用add(-5, 6, Math.abs)时,参数x,y和f分别接收-5,6和函数Math.abs,根据函数定义
//y = 6;
//f = Math.abs;
//f(x) + f(y) ==> Math.abs(-5) + Math.abs(6) ==> 11;
//return 11;

//用代码验证一下:
add(-5, 6, Math.abs); // 11

常用的三个高阶函数

filter()

定义和用法: filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意: filter() 不会对空数组进行检测。

注意: filter() 不会改变原始数组。

 var arr = [1,2,3,5,4,7,9]
 var newArr = arr.filter(item => item % 2 == 0)
 console.log(newArr)//[2,4]

map()

定义和用法: map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

注意: map() 不会对空数组进行检测。

注意: map() 不会改变原始数组。

     var numbers = [1, 2, 3, 5];
     var newNumbers=numbers.map(item => item * 2)
     console.log(newNumbers) //[2,4,6,10] 

reduce()

定义和用法: reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

reduce() 可以作为一个高阶函数,用于函数的 compose。

注意: reduce() 对于空数组是不会执行回调函数的。

var numbers = [2, 3, 5, 7, 9];
var newNumbers=numbers
.reduce((total,item) => item+total)
console.log(newNumbers)  //26

同时使用

var numbers = [1, 2, 3, 6 ,9, 7];
var newNumbers = numbers
.map(item => item * 2 )
.filter(item => item > 10)
.reduce((pre,item) => pre+item)
console.log(newNumbers)  //51