Jest测试防抖节流需用jest.useFakeTimers()控制时间，防抖验证延迟执行与重置，节流验证固定间隔执行；均通过jest.fn()模拟函数并断言调用次数、参数及时机。
用 Jest 编写防抖（debounce）和节流（throttle）的单元测试，核心是控制时间、模拟函数调用、验证执行次数与时机。关键在于：用 jest.useFakeTimers() 替代真实定时器，配合 jest.runAllTimers() 或 jest.advanceTimersByTime() 主动推进时间，再断言函数是否被调用、调用几次、参数是否正确。
一、准备可测试的防抖与节流函数
先确保你有标准实现（以闭包 + 定时器为基础），并导出供测试使用：
utils.js
export function debounce(fn, delay) {
let timer = null;
return function (...args) {
clearTimeout(timer);
timer = setTimeout(() => fn(...args), delay);
};
}
<p>export function throttle(fn, delay) {
let lastCall = 0;
return function (...args) {
const now = Date.now();
if (now - lastCall >= delay) {
fn(...args);
lastCall = now;
}
};
}二、Jest 防抖测试要点（验证“延迟执行”与“重置”）
防抖测试要覆盖：多次调用只触发最后一次；中间调用被取消；delay 到期后准确执行。
- 启用假定时器：
jest.useFakeTimers() - 用
jest.fn()创建被包装函数，便于断言 - 连续调用防抖函数，不立即执行；调用
jest.advanceTimersByTime(delay)后应只执行一次 - 在 delay 内反复调用，再推进时间，仍只执行最后一次传参
utils.test.js
jm-jsjkxyjs02-zlm-405
下载
使用约定式提交（Conventional Commits）生成标准化的 Git 提交信息。适用于以下场景： (1) 暂存更改时需要提交信息； (2) 审查 diff 时希望获得结构化摘要； (3) 编写 PR 描述或变更日志（changelog）条目； (4) 用户明确要求“为本次更改编写提交信息”。 该功能会分析已暂存/未暂存的 diff，并生成按类型（type）划分范围的提交信息。
import { debounce } from './utils';
<p>describe('debounce', () => {
beforeEach(() => {
jest.useFakeTimers();
});</p><p>afterEach(() => {
jest.clearAllTimers();
});</p><p>test('should call fn only once after delay', () => {
const fn = jest.fn();
const debounced = debounce(fn, 100);</p><pre class="brush:php;toolbar:false;">debounced('a');
debounced('b');
debounced('c');
expect(fn).not.toHaveBeenCalled();
jest.advanceTimersByTime(100);
expect(fn).toHaveBeenCalledTimes(1);
expect(fn).toHaveBeenCalledWith('c'); // 最后一次参数}); });
三、Jest 节流测试要点（验证“固定间隔执行”）
节流测试重点是：首次调用立即执行；后续调用在间隔外才执行；间隔内调用被忽略（不累积）。
- 节流不依赖定时器延时，所以
useFakeTimers不是必须，但可用Date.nowmock 精确控制时间戳 - 更推荐用
jest.setSystemTime()模拟时间推进（Jest 27+），或直接 mockDate.now - 验证：t=0 执行 → t=49 不执行 → t=100 执行 → t=149 不执行 → t=200 执行
示例（mock Date.now）：
import { throttle } from './utils';
<p>describe('throttle', () => {
test('should execute fn at most once per delay', () => {
const fn = jest.fn();
const throttled = throttle(fn, 100);</p><pre class="brush:php;toolbar:false;">// t = 0
Date.now = jest.fn().mockReturnValue(0);
throttled('x');
expect(fn).toHaveBeenCalledTimes(1);
expect(fn).toHaveBeenCalledWith('x');
// t = 49 → no call
Date.now.mockReturnValue(49);
throttled('y');
expect(fn).toHaveBeenCalledTimes(1);
// t = 100 → call again
Date.now.mockReturnValue(100);
throttled('z');
expect(fn).toHaveBeenCalledTimes(2);
expect(fn).toHaveBeenLastCalledWith('z');}); });
四、补充建议：测试边界与常见陷阱
实际项目中容易漏测这些点，建议补上：
- delay ≤ 0 时行为（通常应立即执行或退化为原函数，按你的设计约定）
- 防抖函数被多次包装是否独立（闭包隔离性）
- 节流在 delay 为 0 时是否无限执行（需加 guard）
- 使用
jest.clearAllMocks()在 each 测试前重置，避免状态污染 - 异步场景（如防抖内含 Promise）需额外 await +
flush-microtasks，但基础版一般不涉及
不复杂但容易忽略。
