什么是高阶函数？

高阶函数英文叫Higher-order function。JavaScript的函数其实都指向某个变量。既然变量可以指向函数，函数的参数能接收变量，那么一个函数就可以接收另一个函数作为参数，这种函数就称之为高阶函数。

举个最简单的高阶函数

function add(x, y, f) {
	return f(x) + f(y);
	}
	//当调用add(-5, 6, Math.abs)时，参数x，y和f分别接收-5，6和函数Math.abs，根据函数定义，可以推导计算过程为：
	//x = -5;
	//y = 6;
	//f = Math.abs;
	//f(x) + f(y) ==> Math.abs(-5) + Math.abs(6) ==> 11;
	//return 11;
	
	//用代码验证一下：
	add(-5, 6, Math.abs); // 11

编写高阶函数，就是让函数的参数能够接收别的函数

常见的高阶函数

  • map：map()方法定义在JavaScript的Array中,它返回一个新的数组,数组中的元素为原始数组调用函数处理后的值。
function pow(x) {
	    return x * x;
	}
	
	var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
	arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
	
	//map()传入的参数是pow，即函数对象本身。
	
	//不需要map()，写一个循环，也可以计算出结果：
	
	var f = function (x) {
	    return x * x;
	};
	var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
	var result = [];
	for (var i=0; i<arr.length; i++) {
	    result.push(f(arr[i]));
	}

所以，map()作为高阶函数，事实上它把运算规则抽象了，因此，我们不但可以计算简单的f(x)=x2，还可以计算任意复杂的函数，比如，把Array的所有数字转为字符串：

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
	arr.map(String); // ['1', '2', '3', '4', '5', '6', '7', '8', '9']
	//只需要一行代码。
  • filter：filter也是一个常用的操作，它用于把Array的某些元素过滤掉，然后返回剩下的元素。和map()类似，Array的filter()也接收一个函数。和map()不同的是，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素
//例如，在一个Array中，删掉偶数，只保留奇数，可以这么写：
var arr = [1, 2, 4, 5, 6, 9, 10, 15];
var r = arr.filter(function (x) {
    return x % 2 !== 0;
});
r; // [1, 5, 9, 15]

//把一个Array中的空字符串删掉，可以这么写：
var arr = ['A', '', 'B', null, undefined, 'C', '  '];
var r = arr.filter(function (s) {
    return s && s.trim(); // 注意：IE9以下的版本没有trim()方法
});
arr; // ['A', 'B', 'C']

可见用filter()这个高阶函数，关键在于正确实现一个“筛选”函数。

  • sort()当对数组arr = [1, 2, 5, 7, 8, 10, 11]进行排序时，10和11在2的前面，原因是数组中的sort()方法排序，是先将元素转换成String再排序，因为字符‘1’的ASCLL码小于字符‘2’的，所以会出现这种错误
let arr = [1, 2, 5, 7, 8, 10, 11]

console.log(arr.sort())

解决上面的办法是，sort()方法接收一个比较函数来实现自定义排序

    let arr1 = [1, 2, 5, 7, 8, 10, 11]

    function line(x, y) {
        if (x < y) {
            return -1; //当return -1时，为正向排序；当return 1时，为反向排序；
        }
    }
    let newarr = arr1.sort(line)
    console.log(newarr)//[1, 2, 5, 7, 8, 10, 11]

JS中常见的几种高阶函数_高阶函数

  • reduce()累加数组中的值
let arr = [1, 2, 5, 7, 8, 10, 11]

    function add(x, y) {
        return x + y;
    }
    let addValue = arr.reduce(add)
    console.log(addValue);