美文网首页
javascript 函数防抖、函数节流

javascript 函数防抖、函数节流

作者: Northerner | 来源:发表于2017-07-06 11:14 被阅读44次

    函数防抖(debounce )

    var debounce = function(idle, action){
        var last;
        return function(){
            var that = this, args = arguments;
            clearTimeout(last);
            last = setTimeout(function(){
                action.apply(that, args);
            }, idle);
        };
    };
    
    var handle = debounce(2000,function(){
        console.log('########## '+arguments[0]+' ###########');
    });
    
    document.body.onclick= function() {
        console.log('click');
        handle('to do something');
    };
    

    函数节流

    var throttle = function(delay, action){
        var last = 0;
        return function(){
            var curr = +new Date();
            if (curr - last > delay){
                action.apply(this, arguments);
                last = curr;
            }
        };
    };
    
    var handle = throttle(2000,function(){
        console.log('########## '+arguments[0]+' ###########');
    });
    
    document.body.onclick= function() {
        console.log('click');
        handle('to do something');
    };
    

    相关文章

      网友评论

          本文标题:javascript 函数防抖、函数节流

          本文链接:https://www.haomeiwen.com/subject/amkhhxtx.html