防抖和节流

107 阅读1分钟

防抖

是指某个函数在某段时间内,无论触发了多少次回调,都只执行最后一次。

例如:

我们设置了一个等待时间 3 秒的函数,在这 3 秒内如果遇到函数调用请求就重新计时 3 秒,直至新的 3 秒内没有函数调用请求,此时执行函数,不然就以此类推重新计时

节流

是指某个函数在一定时间间隔内(举例3秒)只执行一次,在这 3秒内 无视后来产生的函数调用请求,也不会延长时间间隔。 3秒结束后第一次遇到新的函数调用会触发执行,然后在这新的 3 秒内依旧无视后来产生的函数调用请求,以此类推。

区别

// 防抖  多次点击,只触发一次
if(timer){ 
    clearTimeout(timer) 
}

//节流  一个时间段,只触发一次
if(timer){ 
    return 
}