17370845950

高阶函数是接受函数作为参数或返回函数作为结果的函数；它不自动提升代码质量，但正确使用可减少重复、增强可读性、解耦逻辑，需理解其约束与适用边界。

高阶函数不是“更高级”的函数，而是指接受函数作为参数或返回函数作为结果的函数。它本身不提升代码质量，但用对了能显著减少重复、增强可读性、解耦逻辑——前提是理解它的约束和适用边界。

哪些内置函数是典型的 JavaScript 高阶函数

JavaScript 中最常被误用或浅层使用的高阶函数，其实是数组方法：map、filter、reduce、sort、find 等。它们都接收一个函数（回调）作为参数，且该函数的执行时机、参数顺序、this 绑定都有明确约定。

• map 要求回调返回新值，否则结果数组全是 undefined
• sort 的比较函数必须返回数字（-1/0/1），返回布尔值会导致排序错乱
• reduce 如果省略初始值，第一次调用时 accumulator 是数组第一个元素，currentValue 是第二个——容易在空数组时抛 TypeError

自己写高阶函数时最容易踩的坑

手写高阶函数看似简单，但几个细节会直接导致行为不可预测：

• 没有处理 undefined 或 null 参数：比如封装一个 debounce，若传入的函数是 undefined，应早抛错而不是静默失败
• 忽略 this 绑定：用 call/apply 调用传入函数时，没显式传入上下文，导致内部 this 指向丢失
• 闭包中引用外部变量未做快照：比如循环中创建多个定时器，每个都引用同一个 i，最终全输出循环结束后的值

const loggers = [];
for (var i = 0; i < 3; i++) {
  loggers.push(() => console.log(i)); // 全部输出 3
}
// 正确做法：用 let，或立即执行函数捕获 i

高阶函数 vs 类：什么场景该选哪个

当需要封装状态 + 行为时，别硬套高阶函数。例如实现一个带缓存的 API 调用器：

• 用高阶函数（如 createCachedFetcher(url, cache)）适合一次性配置、无状态复用
• 但若要支持清除缓存、设置过期时间、监听命中率，则 class CachedFetcher 更自然，避免把所有状态塞进闭包或额外参数
• 混用也常见：类内部方法可以是高阶函数返回的结果，比如 this.onSuccess = createHandler(...)

真正难的不是写出高阶函数，而是判断某个逻辑是否值得抽象成它——过度封装会让调用方更难追踪数据流，尤其当嵌套三层以上 compose 或 pipe 时，错误堆栈和调试成本会陡增。