防抖的目的是在一段时间内,只执行一次函数。 下面是一个使用 JavaScript 实现防抖的示例:
function debounce(fn, delay) {
// 定义一个标志,表示函数是否正在执行
let flag = false;
return function() {
// 如果函数正在执行,则不做任何操作
if (flag) return;
flag = true;
setTimeout(() => {
// 延迟 delay 毫秒后,执行函数,并将标志设为 false
fn();
flag = false;
}, delay);
}
}
// 使用示例
const debouncedFn = debounce(() => {
console.log('这是一个防抖函数');
}, 1000);
debouncedFn();
在这个示例中,我们使用了一个叫做 debounce
的函数,它接受两个参数:一个函数 fn
和一个整数 delay
。在调用 debounce
函数时,它会返回一个新的函数,这个新函数每隔 delay
毫秒才会调用一次 fn
函数。如果在这个时间内再次调用这个新函数,则会忽略调用。