最近刚接触到高阶函数这个词语，简单了解了下，就在这里记录下学习成果
什么是高阶函数？
高阶函数英文名叫：Higher-order function 。
如果一个函数的参数也是一个或是多个函数，或者函数的返回值是函数的话。就把这个函数称为高阶函数。
类型一：参数是函数 （Function）
JS语言中内置了几种高阶函数,包含 Array.prototype.map, Array.prototype.filter和Array.prototype.reduce, 它们都需要接受一个函数作为参数，并且可以应用函数到数组的每一个元素。下面是对这几种函数应用的具体介绍，
Array.prototype.map
map()方法 又可以称之为映射函数，map()方法最终的结果是创建一个新的数组，其中数组的每个元素就是执行，map（）函数内部传入的函数参数每次执行的结果。同时原始数组的值不会改变
语法
arr.map(function(currentValue,index,arr),thisValue)
参数说明
function(currentValue, index, arr)
必需参数。函数参数。用于执行每个数组元素的函数
currentValue: 必需参数，当前数组的元素
index: 可选参数。当前元素的索引
arr: 可选参数。当前元素所属的数组对象，即原始数组
thisValue
可选参数。 对象作为该执行回调时使用，传递给函数，用作“this”的值。
如果省略了thisValue，或者传入null、undefined,那么回调函数的this为全局对象
map() 应用
给个例子，实现一个让数组所有元素*2的操作
不使用map
let arr = [1, 2, 3, 4];
let newarr = [];
for (let i = 0; i < arr.length; i++) {
newArr.push(arr[i] * 2);
}
console.log(newarr) // [2, 4, 6, 8]
console.log(arr) // [1, 2, 3, 4]
使用map
let arr = [1, 2, 3, 4];
let newarr = arr.map(currentV => {
return currentV*2
})
console.log(newarr) // [2, 4, 6, 8]
console.log(arr) // [1, 2, 3, 4]
Array.prototype.filter
filter()方法 又称为过滤函数，同样也是返回一个新的数组，该新数组的元素必须符合传入的callback函数的执行规则，该callback函数有两种结果，true，或者false即满足规则或者不满足规则，如果该列表元素满足规则，则会添加到新的数组里，不满足则被过滤掉，所以是过滤函数。同时原始数组的值不会改变。
语法
arr.filter(function(currentValue,index,arr),thisValue)
参数说明
function(currentValue, index, arr)
必需参数。函数参数。用于执行每个数组元素的函数
currentValue: 必需参数，当前数组的元素
index: 可选参数。当前元素的索引
arr: 可选参数。当前元素所属的数组对象，即原始数组
thisValue
可选参数。 对象作为该执行回调时使用，传递给函数，用作“this”的值。
如果省略了thisValue，或者传入null、undefined,那么回调函数的this为全局对象
filter() 应用
给个例子，实现一个让数组去重的操作
不使用filter
let arr1 = [1, 1, 2, 5, 2, 3, 5, 4, 8];
let arr2 = []
for (let i = 0; i < arr1.length; i++) {
if (arr1.indexOf(arr1[i]) === i) {
arr2.push(arr1[i])
}
}
console.log(arr2) //[1, 2, 5, 3, 4, 8]
console.log(arr1) //[1, 1, 2, 5, 2, 3, 5, 4, 8]
使用filter
let arr1 = [1, 1, 2, 5, 2, 3, 5, 4, 8];
let arr2= arr1.filter((currentV, index, self)=> {
return self.indexOf(currentV) === index
})
console.log(arr2) //[1, 2, 5, 3, 4, 8]
console.log(arr1) //[1, 1, 2, 5, 2, 3, 5, 4, 8]
Array.prototype.reduce
reduce() 方法接收一个函数callback作为累加器，对数组中的每个元素执行该callback函数，最终的结果是计算为一个值。
语法
array.reduce(function(total, currentValue, currentIndex, arr), initalValue)
参数说明
function(total, currentValue, currentIndex, arr)
必需参数。函数参数。用于执行每个数组元素的函数
total：必需参数，初始值，或者是计算结束后的返回值，即每次函数执行结束后的返回值，也可以叫（上一次的值）
currentValue: 必需参数，当前数组的元素
currentIndex: 可选参数。当前元素的索引
arr: 可选参数。当前元素所属的数组对象，即原始数组
initalValue
可选参数。 第一次计算的初始值
reduce()应用
给个例子，四舍五入后计算数组元素的求和
不使用reduce
let array = [1.5, 1.6, 2.0, 5.6, 2.9];
let sum = 10;
for (let index = 0; index < array.length; index++) {
sum = sum + Math.round(array[index]);
}
console.log(sum) //15
console.log(array) //[1.5, 1.6, 2.0, 5.6, 2.9]
使用reduce
let array = [1.5, 1.6, 2.0, 5.6, 2.9];
let sum = array.reduce((total, currentV) => total + Math.round(currentV), 10)
console.log(sum) //25
console.log(array) //[1.5, 1.6, 2.0, 5.6, 2.9]
类型二：函数作为返回值输出
这个比较好理解，就是一个函数的返回值 还是一个函数类型
函数作为返回值输出的应用
封装的一个isType函数
//判断类型 Object.prototype.toString.call(obj)
let isString = obj => Object.prototype.toString.call(obj) === '[object String]'
let isArray = obj => Object.prototype.toString.call(obj) === '[object Array]'
let isNumber = obj => Object.prototype.toString.call(obj) === '[object Number]'
alert(isString('123')) //true
alert(isArray([1, 7])) //true
alert(isNumber(1)) //true
//封装isType 进行判断类型
let isType = type =>obj => {
return Object.prototype.toString.call(obj) === `[object ${type}]`
}
alert(isType('Number')(1))//true
alert(isType('String')('123')) //true
alert(isType('Array')([1, 7])) //true
alert(isType('Number')(1)) //true
备注： 函数内部继续返回函数的话 调用方法是 函数名（函数参数）（内部函数1参数）。
类似这种函数返回另外一个函数的类型，调用的方式是连续执行调用不同层的函数。最外层只是构建了一个外层函数体对象。
相关
初次接触高阶函数，有不正确的请多指导纠正
引用参考：https://muyiy.cn/blog/6/6.1.html#函数作为返回值输出
网友评论