防抖与节流-一一网

每天做个总结吧，坚持就是胜利！

    /**
        @date 2021-06-12
        @description 防抖与节流
    */
复制代码

壹（序）

防抖就是高频的触发某个事件时，只会触发其中时间间隔超过time的，这样可以避免很多重复事件的触发而导致的性能消耗。比如window的onresize事件。

节流就是高频的触发某个事件时，在给定时间间隔内只会调用一次，同样是避免性能消耗。比如点击按钮发送请求时。

贰（代码实现简单防抖）

简单实现防抖函数，真正使用最好是调用类库如lodash；

const debounce = (fn, wait = 1000) => {
    let timeout = null;
    
    return function() {
        clearTimeout(timeout);
        timeout = setTimeout(() => {
            fn.apply(this, arguments);
        }, wait)
    }
}
复制代码

叁（代码实现简单节流）

简单实现节流函数，真正使用最好是调用类库如lodash；

const throttle = (fn, wait = 1000) => {
    let flag = false;
    
    return function() {
        if(!flag) {
            flag = true;
            setTimeout(() => {
                flag = false;
                fn.apply(this, arguments);
            })
        } else {
            return;
        }
    }
}
复制代码