防抖&节流代码实现
防抖函数
设置一个定时器,当我们重复调用一次函数,我们就清除定时器,重新定时,直到在设定的时间段内没有重复调用函数
// fn 需要执行的方法
// delay 延时时间,默认给个500毫秒
function debounce(func, delay) {
//定义一个定时器
let timer;
return function() {
// 返回一个闭包,延长其定时器的生命周期,重复调用函数会清理上一个定时器
clearTimeout(timer);
timer = setTimeout(() => {
func.apply(this, arguments);
}, delay);
};
}
节流函数
可以理解为一个控制阀门,这一段时间内只执行第一次
/**
* func 需要执行的方法
* delay 延时时间,默认给个300毫秒,可以根据需求自定义
*/
function throttle(func, delay) {
let timer;
return function() {
// 如果没有定时器,就执行该函数;有定时器就不处理
if (!timer) {
timer = setTimeout(() => {
// this:改变this指向 arguments:拿到传递的参数信息
func.apply(this, arguments);
timer = null;
}, delay);
}
};
}
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix