防抖节流

191 阅读1分钟

防抖

所谓防抖,就是指触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间。

/**
 * @desc 函数防抖
 * @param fn 函数
 * @param delay 延迟执行毫秒数
 */

function debounce(fn, delay) {
    var timer = null;
    return function () {
        var self = this;
        var args = arguments;
        clearTimeout(timer);
        timer = setTimeout(function () {
            fn.apply(self, args);
        },delay)
    }
}

// 注意 this 和 arguments 的传递;

节流

所谓节流,就是指连续触发事件但是在 n 秒中只执行一次函数。

function throttle(fn, delay) {
    var timer = null;
    var prev = 0;
    return fucntion () {
        var self = this;
        var args = arguments;
        if(!timer){
            timer = setTimeout(function () {
                timer = null;
                fn.apply(self, args);
            },delay)   
        }
        
    }
}