JS中几种常见的高阶函数

高阶函数定义

高阶函数是对其他函数进行操作的函数，可以将它们作为参数或通过返回它们。简单来说，高阶函数是一个函数，它接收函数作为参数或将函数作为输出返回。

JavaScript中常见的高阶函数

map：

该map()方法通过调用作为输入数组中每个元素的参数提供的回调函数来创建一个新数组。该map()方法将从回调函数中获取每个返回值，并使用这些值创建一个新数组。

语法：array.map(function(currentValue,index,arr), thisValue)

参数	描述
function(currentValue,index,arr)	必须。函数
currentValue	必须。当前元素。
index	可选。当前元素的索引值。
arr	可选。当期元素属于的数组对象。
thisValue	可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined"。

例子： 将数组[1,2,3,4]中的每一项乘2，然后输出数组；

不是高阶函数

var arr = [1,2,3,4];
var arr1 = [];
for(var i = 0; i < arr.length; i++) {
    arr1.push(arr[i] * 2);
}
console.log(arr1); //[2,4,6,8]

高阶函数map

var arr = [1,2,3,4];
var arr1 = arr.map(item => item * 2);
cosnole.log(arr1); // [2,4,6,8]

两个运行的结果是一致的，但是高阶函数相对起来更简洁明了。

reduce：

语法： array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数	描述
function(currentValue,index,arr)	必须。函数
total	必需。初始值, 或者计算结束后的返回值。
currentValue	必须。当前元素。
index	可选。当前元素的索引值。
arr	可选。当期元素属于的数组对象。
thisValue	可选。传递给函数的初始值，即total的初始值。

Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上，这个函数必须接收两个参数，reduce()把结果继续和序列的下一个元素做累积计算，其效果就是：

飞高阶函数

var arr = [1, 3, 5, 7, 9];
var str = 0;
for (i = 0;i < arr.length; i++) {
    str += arr[i]
}
console.log(str); // 25

高阶函数reduce

var arr = [1, 3, 5, 7, 9];
var str = arr.reduce(function (x, y) {
    return x + y;
}); 
console..log(str); // 25

filter:

filter也是一个常用的操作，它用于把Array的某些元素过滤掉，然后返回剩下的元素。和map()类似，Array的filter()也接收一个函数。和map()不同的是，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素。

filter高阶函数

//例如，在一个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']

当然不止这三个，还有别的高阶函数如数组排序的sort等，也可以自己编写高阶函数，详情可以访问W3Cschool的相关教程，链接地址。