节流函数和防抖函数

节流函数

节流即throttle,规定一个单位时间，在这个单位时间内，只能有一次触发事件的回调函数执行，若是在同一个单位时间内某事件被触发屡次，只有一次能生效。

function throttle(fn, interval = 300) {
    let canRun = true;
    return function () {
        var context = this
        if (!canRun) return;
        canRun = false;
        setTimeout(() => {
            fn.call(context, arguments);
            canRun = true;
        }, interval);
    };
}
复制代码

防抖函数

debounce 函数防抖是指频繁触发的状况下，只有足够的空闲时间，才执行代码一次。好比坐电梯门要关了，结果有我的又要进来，电梯门就须要从新开关，想象若是有10我的陆陆续续进来，电梯门就会开开关关屡次，这样的话还不如固定时间关一次门，用来节省消耗。

function debounce(method,time){
    var timer = null ;
    return function(){
        var context = this;
        //在函数执行的时候先清除timer定时器;
        clearTimeout(timer);
        timer = setTimeout(function(){
            method.call(context, arguments);
        },time);
    }
}
复制代码