学会高阶函数是每一个前端开发者走向高级阶段的必经之路，虽然你可以在业务代码中不去使用，但你总需要去读懂别人的代码吧，如果你不熟悉这些高阶使用方法，必然会遭到鄙视嘲笑，甚至强行复制粘切不明大意的胡乱修改会带来灾难性的后果，当然学习高阶函数也不仅仅是要去使用几个高阶函数方法，最主要的是领略其设计思想，为自己之后写出牛逼点的代码做基础。
高阶函数概念
一等函数
您可能听说过JavaScript将函数视为一等公民。那是因为在JavaScript或任何其他函数式编程语言中，函数是对象。
在JavaScript中，函数是一种特殊类型的对象。他们是Function对象。
在JavaScript中，您可以使用其他类型（如对象，字符串或数字）执行的所有操作函数都可以执行。您可以将它们作为参数传递给其他函数（回调函数），将它们分配给变量并传递它们等等。这就是JavaScript中的函数被称为First-Class函数(一等函数)的原因。
与之相对应的就是：
高阶函数
高阶函数是对其他函数进行操作的函数，可以将它们作为参数或通过返回它们。简单来说，高阶函数是一个函数，它接收函数作为参数或将函数作为输出返回。
js中常见的高阶函数
map
定义：map()方法定义在JavaScript的Array中，它返回一个新的数组，数组中的元素为原始数组调用函数处理后的值。
注意：map()不会对空数组进行检测，map()不会改变原始数组
语法：array.map(function(currentValue, index, arr), thisIndex)
参数说明：
function(currentValue, index, arr)：必须。为一个函数，数组中的每个元素都会执行这个函数。其中函数参数：
currentValue：必须。当前元素的的值。
index：可选。当前元素的索引。
arr：可选。当前元素属于的数组对象。
thisValue：可选。对象作为该执行回调时使用，传递给函数，用作"this"的值。
实例打印结果：
let indexValue = [6,7,8];
let resultArry = arry.map(function(currentValue, index, arr){
console.log("currentValue: "+currentValue);
console.log("index: "+index);
console.log("arr: "+arr);
console.log("indexValue: "+indexValue);
console.log("this: "+this);
console.log("----------------------------------------")
},indexValue)
VM1084:4 currentValue: 2
VM1084:5 index: 0
VM1084:6 arr: 2,3,4
VM1084:7 indexValue: 6,7,8
VM1084:8 this: 6,7,8
VM1084:9 ----------------------------------------
VM1084:4 currentValue: 3
VM1084:5 index: 1
VM1084:6 arr: 2,3,4
VM1084:7 indexValue: 6,7,8
VM1084:8 this: 6,7,8
VM1084:9 ----------------------------------------
VM1084:4 currentValue: 4
VM1084:5 index: 2
VM1084:6 arr: 2,3,4
VM1084:7 indexValue: 6,7,8
VM1084:8 this: 6,7,8
VM1084:9 ----------------------------------------
可以清楚的看到以上各个参数在运行过程的值。
经典应用：求数组各项平方：
let a = [0,1,2,3];
let aSquare = a.map(x=>x*x);
console.log(aSquare)//[0, 1, 4, 9]
reduce
定义:
reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
reduce() 可以作为一个高阶函数，用于函数的 compose,见“js高级进阶之compose与pipe”。
注意: reduce() 对于空数组是不会执行回调函数的和map一样。
语法：array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
参数说明：
function(total,currentValue, index,arr)：必需。用于执行每个数组元素的函数。函数参数:
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
实例打印每个参数的值：
let b = [10,100,1000];
let initialValue = [10,20]
let res = b.reduce(function(total, currentValue, currentIndex, arr){
console.log("total:"+total);
console.log("currentValue:"+currentValue);
console.log("currentIndex:"+currentIndex);
console.log("arr:"+arr);
console.log("initialValue:"+initialValue);
console.log("------------------------------");
}, initialValue)
VM1169:5 total:10,20
VM1169:6 currentValue:10
VM1169:7 currentIndex:0
VM1169:8 arr:10,100,1000
VM1169:9 initialValue:10,20
VM1169:10 ------------------------------
VM1169:5 total:undefined
VM1169:6 currentValue:100
VM1169:7 currentIndex:1
VM1169:8 arr:10,100,1000
VM1169:9 initialValue:10,20
VM1169:10 ------------------------------
VM1169:5 total:undefined
VM1169:6 currentValue:1000
VM1169:7 currentIndex:2
VM1169:8 arr:10,100,1000
VM1169:9 initialValue:10,20
VM1169:10 ------------------------------
reduce实例应用数组求和
let b = [10,100,1000];
let sum = b.reduce((total,currentValue)=>total+=currentValue,0);
console.log(sum)//1110
假设我们希望求数字10000与数组 b 中元素的和呢，那就这么写：
let b = [10,100,1000];
let sum = b.reduce((total,currentValue)=>total+=currentValue,10000);
console.log(sum)
VM1268:3 11110
reduce实例应用数组去重
let c = [1,2,3,2,1,null,null]
let result = c.reduce((ac,current)=>{
return ac.includes(current)?ac : ac.concat(current);
},[])
console.log(result);
reduce实例应用数组降维
let d = [[1,2],[3,4],[5,6]];
let cd = d.reduce((total,current)=>{
return total.concat(current)
},[])
console.log(cd)
VM140:8 (6) [1, 2, 3, 4, 5, 6]
filter
定义和用法：
filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
注意： filter() 不会对空数组进行检测。
注意： filter() 不会改变原始数组。
语法 array.filter(function(currentValue,index,arr), thisValue)
参数说明：
function(currentValue, index,arr) 必须。函数，数组中的每个元素都会执行这个函数函数参数:
currentValue 必须。当前元素的值
index 可选。当前元素的索引值
arr 可选。当前元素属于的数组对象
thisValue 可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue ，“this” 的值为 “undefined”
实例应用打印参数值
let as =[2,3,3,3,6];
let thisValue = 0;
as.filter(function(currentValue,index,arr){
console.log("currentValue:"+currentValue);
console.log("index:"+index);
console.log("arr:"+arr);
console.log("initialValue:"+thisValue);
console.log("------------------------------");
}, thisValue)
VM194:5 currentValue:2
VM194:6 index:0
VM194:7 arr:2,3,3,3,6
VM194:8 initialValue:0
VM194:9 ------------------------------
VM194:5 currentValue:3
VM194:6 index:1
VM194:7 arr:2,3,3,3,6
VM194:8 initialValue:0
VM194:9 ------------------------------
VM194:5 currentValue:3
VM194:6 index:2
VM194:7 arr:2,3,3,3,6
VM194:8 initialValue:0
实例应用数组去除偶数值
let as =[2,3,4,5,6];
as.filter((current,index)=>{
return current%2 == 0
})
(3) [2, 4, 6]
flat
数组扁平化处理----降维
[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]
来源：CSDN
作者：guocongcong-cc
链接：https://blog.csdn.net/weixin_40073115/article/details/103844960