Javascript的防抖/限流

1、防抖

function lazyFunction(fn, timeout){
    var timer = 0;
    return function(){
        if(timer) window.clearTimeout(timer);
        var args = arguments, that = this;
        timer = window.setTimeout(function(){
            fn.apply(that, args)
        }, timeout);
    };
}

var func = lazyFunction(function(name){
        console.log(name);
    }, 500);
 
    func('test1');
    func('test2');
    func('test3');
    func('test4');
    //每调用一次，都重置timer，设置新的timeout，在timeout时间内，连续执行，只执行最后一个超过timeout的方法
    //这里只有func('test4');会被执行正常输出结果

2、限流

function limitFunction(fn, timeout){
    var last_exec = 0;
    return function(){
       var now = +new Date();
       if(now - last_exec < timeout) return;
        last_exec = now;
        fn.apply(this, arguments);
    };
}

var func = limitFunction(function(name){
        console.log(name);
    }, 500);
 
    func('test1');
    func('test2');
    setTimeout(function(){
        func('test3');
    }, 600);
    //这里func('test2')不会被执行

至于这两个方法的区别，直观点：
分别用两个方法封装到func，然后鼠标一直点一个按钮执行func。
1、对于防抖，被封装的方法可能永远不会被执行。
2、对于限流，被封装的方法第一次会被执行，然后每当距上次执行时间间隔超过timeout后会被执行一次。