指连续触发事件但只在最后一次触发后才执行一次处理函数的方法。在设定的时间间隔内,如果触发了多次事件,则只有最后一次事件触发后的一段时间内没有再触发事件,才会执行处理函数。例如,在用户输入搜索关键字时,我们可能需要使用防抖方法,以避免每次输入都触发请求,导致服务器压力过大。
js var debounce = function(func,delay){
let timer;
return function(...args){
if(timer){
clearTimeout(timer)
}
timer=setTimeout(function(){
func.apply(this,args)
},delay)
}
}
指在一定时间间隔内,无论触发了多少次事件,都只执行一次处理函数的方法。例如,当我们监听窗口的滚动事件时,可以使用节流方法,以避免滚动过程中触发过多的计算和渲染操作,导致页面卡顿。
jsvar throttle = function (func, wait) {
let now, timer;
let previous = 0;
return function (...args) {
now = +(new Date());
if (now - previous >= wait) {
timer&&clearTimeout(timer);
func.apply(this, args);
previous = now;
}
else{
timer&&clearTimeout(timer);
console.log(wait - now + previous)
timer = setTimeout(() => {
func.apply(this, args);
previous = now;
}, wait - now + previous)
}
}
}
本文作者:BARM
本文链接:
版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!