js防抖和节流

防抖和节流在前端性能优化中很常用,防抖和节流都是对一段时间内事件触发函数执行频率的控制;使用场景就是当频繁事件时怎样去处理函数执行。

防抖

在限定时间内,如果事件再次触发,丢弃当前已响应的函数执行,以当前事件响应函数重新计时

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function debounce(fn, wait) {
wait = wait || 200;
var timer = null;
return function () {
if (timer) {
clearTimeout(timer);
}
var args = arguments;
var that = this;
timer = setTimeout(function () {
timer = null;
fn.apply(that, args);
}, wait)
}
}