防抖
在滚动事件中需要做个复杂计算或者实现一个按钮的防二次点击操作。一些浏览器件:window.onresize、window.mousemove等,触发的频率非常高,会造成浏览器性能问题,如果你碰到这些问题,那就需要用到函数节流和防抖了。
这些需求都可以通过函数防抖动来实现。尤其是第一个需求,如果在频繁的事件回调中做复杂计算,很有可能导致页面卡顿,不如将多次计算合并为一次计算,只在一个精确点做操作。
防抖和节流的作用都是防止函数多次调用。区别在于,假设一个用户一直触发这个函数,且每次触发函数的间隔小于wait,防抖的情况下只会调用一次,而节流的 情况会每隔一定时间(参数wait)调用函数。
function debounce(fn) {
let timer7 = null;
return function () {
clearTimeout(timer7)
timer7 = setTimeout(fn, 1000)
}
}
// 延迟处理事件
$('#clickBtn')