站内搜索:
首页 >> 前端 >> 内容
函数节流与函数去抖的代码实例

时间:2017/9/28 9:11:00

debounce:把触发非常频繁的事件合并成一次执行

throttle:设置一个阀值,在阀值内,把触发的事件合并成一次执行;当到达阀值,必定执行一次事件

debounce

_.debounce(action, time);

var debounce = function(action, delay) {
    var timer = null;

    return function() {
        var self = this, 
              args = arguments;

        clearTimeout(timer);
        timer = setTimeout(function() {
            action.apply(self, args)
        }, delay);
    }
}

// example
function resizeHandler() {
    console.log("resize");
}

window.onresize = debounce(resizeHandler, 300);

throttle

_.throttle(action, time, mustruntime);

var throttleV1 = function(action, delay, mustRunDelay) {
    var timer = null,
          startTime;

    return function() {
        var self = this, 
              args = arguments, 
              currTime = new Date();

        clearTimeout(timer);

        if(!startTime) {
            startTime = currTime;
        }

        if(currTime - startTime >= mustRunDelay) {
            action.apply(self, args);
            startTime = currTime;
        }
        else {
            timer = setTimeout(function() {
                action.apply(self, args);
            }, delay);
        }
    };
};

  • 上一篇:mocha编写测试常用命令
  • 下一篇:关于this、arguments、caller、callee、prototype、__proto__、length知识讲解
  • 返回顶部