在事件防抖中应用柯里化,是将 delay 和 options 提前固化为可复用的工厂函数,生成语义明确、配置一致的专用防抖器,避免重复传参和配置错误。

在事件防抖函数中应用柯里化,核心不是用柯里化“实现”防抖,而是用柯里化把防抖函数变成可配置、可复用的工厂函数——即先固定 delay 和 options,再生成专用防抖器。
为什么要在防抖里用柯里化
普通防抖每次都要重复写延迟和选项,比如:
debounce(search, 300)debounce(save, 1000, { leading: true })debounce(resizeHandler, 200, { trailing: false })
容易出错、难维护。柯里化帮你把「配置」提前固化,后续调用更简洁、语义更清晰。
怎么写一个支持柯里化的防抖工厂
关键在于:返回一个接收 fn 的函数,而 delay 和 options 已由外层闭包捕获。
立即学习“Java免费学习笔记(深入)”;
- 先定义基础防抖函数(带完整参数)
- 再封装一个高阶函数,只接收 delay 和 options,返回一个预设好这些参数的防抖函数
- 这个返回的函数,就是柯里化后的“专用防抖器”
示例代码:
function debounce(fn, delay, options = {}) {
let timer = null;
const { leading = false, trailing = true } = options;
return function (...args) {
const later = () => {
if (trailing) fn.apply(this, args);
timer = null;
};
const callNow = leading && !timer;
if (timer) clearTimeout(timer);
timer = setTimeout(later, delay);
if (callNow) fn.apply(this, args);
};
}
// 柯里化工厂:固定 delay 和 options
function debounceWith(delay, options = {}) {
return function (fn) {
return debounce(fn, delay, options);
};
}
// 使用:生成不同场景的防抖函数
const searchDebounce = debounceWith(400); // 默认 400ms,trailing 为 true
const saveDebounce = debounceWith(800, { leading: true }); // 输入即触发一次
const resizeDebounce = debounceWith(150, { trailing: false }); // 只在开始时执行
实际调用时怎么用
生成后,直接传入业务函数即可,不用再关心 delay 和选项:
input.addEventListener('input', searchDebounce(handleSearch))button.addEventListener('click', saveDebounce(handleSave))window.addEventListener('resize', resizeDebounce(handleResize))
每个绑定都自带明确语义,比如 searchDebounce 就是专用于搜索输入的防抖逻辑,别人一眼能懂,也不怕配错参数。
进阶:支持自动柯里化(通用 currying 函数)
如果项目中柯里化使用频繁,可以抽象一个通用 currying 工具:
function curry(fn, arity = fn.length) {
return function curried(...args) {
if (args.length >= arity) {
return fn(...args);
}
return (...moreArgs) => curried(...args, ...moreArgs);
};
}
// 然后让 debounce 支持自动柯里化:
const curriedDebounce = curry(debounce, 3); // 显式指定需 3 参数
const searchDebounce = curriedDebounce(400)(); // 可逐步传参
但日常开发中,显式工厂函数(debounceWith)更直观、可控、易调试,推荐优先采用。


















