高阶函数是JavaScript中函数作为一等公民的体现，指接收函数为参数、返回函数或两者兼有的函数，如map、filter、reduce；其核心是分离“怎么执行”与“做什么”，需通过once、debounce等实践掌握，并注意this绑定、命名可读性及适用场景。
高阶函数不是语法糖，而是 JavaScript 中函数作为一等公民的直接体现：它要么接收函数作为参数，要么返回函数，或者两者兼有。理解这一点，才能避免把它当成“炫技写法”来用。
什么是高阶函数？看 map、filter、reduce 就明白了
它们不是特殊语法，而是普通函数——只是参数里明确要求传入另一个函数。比如 arr.map(callback) 的 callback 必须是函数；[1,2,3].filter(x => x > 1) 里箭头函数就是被传入的函数值。
-
map对每个元素调用函数，返回新数组 -
filter用函数判断真假，保留为true的元素 -
reduce用函数累积计算，最终产出单个值
它们本身不处理具体逻辑，只负责“怎么执行”，把“做什么”交给传入的函数——这就是高阶函数的核心分工。
自己写高阶函数：从 once 和 debounce 开始
真正掌握高阶函数，得动手封装。比如限制函数只执行一次：
立即学习“Java免费学习笔记（深入）”；
function once(fn) {
let called = false;
return function(...args) {
if (!called) {
called = true;
return fn.apply(this, args);
}
};
}
再比如防抖（debounce）——常见于搜索框输入，避免频繁触发请求：
function debounce(fn, delay) {
let timer;
return function(...args) {
clearTimeout(timer);
timer = setTimeout(() => fn.apply(this, args), delay);
};
}
- 两个函数都返回新函数，而不是立即执行
- 闭包保存了内部状态（
called或timer），这是高阶函数保持行为的关键 - 调用时不要加括号：不是
once(myFn)()，而是const safeFn = once(myFn); safeFn();
容易踩的坑：不是所有“带函数的函数”都是高阶函数
常见误解是只要参数里有函数就叫高阶函数。但关键在“是否把函数当数据传递并参与控制流”。比如：
-
setTimeout(fn, 1000)是高阶函数——它接收fn并决定何时调用 -
JSON.stringify(obj, replacer)中的replacer是高阶函数——它被递归调用以控制序列化逻辑 - 但
addEventListener('click', handler)虽然也传函数，本质是注册回调，不改变控制结构，通常不归类为典型高阶函数用法（除非你封装一个onOnceClick）
更隐蔽的坑是 this 绑定丢失：arr.map(obj.method) 会出错，因为 method 被剥离了 obj 上下文。应写成 arr.map(x => obj.method(x)) 或 arr.map(obj.method.bind(obj))。
什么时候该用？别为了高阶而高阶
高阶函数的价值在于抽象重复的执行模式，不是让代码变短。如果逻辑简单、只用一次，写个 for 循环反而更直白。
- 适合场景：需要统一处理流程（如批量转换、条件筛选、异步链式控制）
- 不适合场景：单次、分支多、调试要求高（高阶函数堆叠后堆栈难追踪）
- 性能注意：
map/filter每次都新建数组；高频调用时考虑for循环或reduce合并操作
最常被忽略的一点：高阶函数的可读性高度依赖命名和上下文。withLoading(fetchUser) 比 wrap(fetchUser) 明确得多——函数名必须说清“加了什么行为”，否则团队协作时没人敢动。
