function throttle(fn, wait) {
let preTime = null;
return function (...args) {
let nowTime = Date.now();
if (!preTime || nowTime - preTime > wait) { // 检查 preTime 是否为 null 或时间间隔是否超过 wait
fn.call(this, ...args);
preTime = nowTime; // 更新 preTime
}
};
}
测试代码:
以下是一个简单的测试代码,用于验证节流函数是否正常工作:
function logMessage(message) {
console.log(`${message} - ${Date.now()}`);
}
const throttledLog = throttle(logMessage, 1000);
// 测试
setInterval(() => {
throttledLog("Throttled message");
}, 200); // 每 200ms 触发一次,但节流函数会限制为每 1000ms 执行一次
输出结果:
每隔 1000ms 输出一次 "Throttled message",而不是每次触发都输出。
说明:
这种节流实现方式是基于时间戳的,它会在每次触发事件时检查时间间隔是否超过指定的 wait 时间。如果超过,则执行函数并更新时间戳。这种方式适用于大多数场景,但如果你需要更复杂的节流行为(例如在最后一次触发时延迟执行),可以考虑使用定时器实现节流。