美文网首页
JavaScript - 函数节流throttle

JavaScript - 函数节流throttle

作者: ElricTang | 来源:发表于2019-10-07 16:16 被阅读0次

    函数节流:

    • 函数被频繁调用,会造成性能问题。函数节流保证固定时间间隔内,无论被重复调用多少次都只执行一次。
    • 应用场景:浏览器resize、无限加载、滚动条

    1.定时器实现节流

            function throttle(fn,delay){
                let timer = null;
                return (...args)=>{
                    if(timer){
                        return
                    }
                    timer = setTimeout(()=>{
                        fn(args);
                        timer = null;                 
                    },delay||1000)
                }
            }
    

    2.计算时间差实现节流

            function throttle(fn,delay){
                let history = Date.now();
                return (...args)=>{
                    let now = Date.now();
                    if( now - history >= delay ){
                        fn(args);
                        history = Date.now();
                    }
                };
            }
    

    相关文章

      网友评论

          本文标题:JavaScript - 函数节流throttle

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