这是我参与11月更文挑战的第12天，活动详情查看：2021最后一次更文挑战
前几篇文章-直达列表 学习了几个 JavaScript 并不完美但是不影响其运行的一些神奇小"bug":
上一篇写到 函数的可选参数, 本篇来学习 JavaScript 函数进阶之 高阶函数
JavaScript 函数-高阶函数
我们可以使用普通函数来构建抽象,这是一个好方法, 但这是远远不够的. 好多时候很多重复性的工作, 我们完全可以抽离出来, 作为一个功能函数, 然后将这个功能函数传递给一个普通函数, 这样高阶函数就出现了. 高阶函数听上去还是比较高级的, 因为它的名字就是高阶.
高阶函数概念
对比: 前面有学到闭包-函数嵌套函数, 那么递归也同样在函数内部嵌套自己, 那么高阶函数则是会用函数作为参数或者返回一个函数.
而高阶函数: 对其他函数进行操作, 一个函数将其他函数作为参数 或者 返回其他函数来进行操作, 这样的函数都称之为 高阶函数
高阶函数允许我们不仅对值, 而且可以对 操作(功能函数 actions) 进行抽象.
简单理解就是函数操作函数: 使用函数作为参数, 或者返回一个新函数, 这样的函数就是高阶函数.
高阶函数 使用
可以使用 高阶函数 来创建新的函数:
- 这里高阶函数 返回一个函数
function greaterFn(nn) {
return (cal) => cal > nn
}
- 通过
高阶函数创建了一个 函数 greaterFn22
let greaterFn22 = greaterFn(22)
console.log(greaterFn22)
// cal => cal > nn
console.log(greaterFn22(33)) // true ---> 33 > 22
?? 这里有个问题:
通过给greaterFn 传递一个参数 nn = 22,
然后赋值给 greaterFn22, 但是控制台输出的 greaterFn22 却是 cal => cal > nn,
但是变量已经赋值为 22了, 那高阶函数返回的不应该是 cal => cal > 22吗?
- 使用函数作为参数传递给高阶函数
// 定义一个方法
let map = (arr, fn) => {
arr.map(arr, fn)
}
// 注意这里面 fn 参数的不同
// 高阶函数: 传参为 函数
function greaterFn(fn) {
return a => map(a, fn)
}
let increment = x => x + 1;
let arr = [7, 8, 9]
const incarr = greaterFn(increment)
incarr(arr) // [8, 9, 10]
上面的写法是不是感觉有点绕了, 没错, 开始接触高阶函数多多少少有点理解不了为何要这么麻烦, 后面学习就能理解其中的妙用了
