码迷,mamicode.com
首页 > 其他好文 > 详细

节流和防抖

时间:2020-02-17 18:18:27      阅读:76      评论:0      收藏:0      [点我收藏+]

标签:console   内存   deb   计时   ons   date()   常驻内存   art   设置   

都是解决用户频繁执行某个任务导致的问题

防抖

  • 指的是用户触发某动作时,一段时间后执行,比如3s后执行,如果用户多次点击,则重新计时
  • 实现思路:设置一个变量lasttime用来记录上次的执行时间,如果现在的时间-上次的时间>等待的时间,则执行任务,否则将lasttime赋值为nowtime,重新计时
const debunde=function(fn,wait){
    /**
             * 防抖:指的是,当某个功能执行时需要隔固定的时间才开始执行,如果持续的点击,则会重新计时
             */
            
            var timer=null
            
            // 使用闭包使得timer一直在内存中
            
            return function(){
                if(timer){
                    //如果没达到时间,则重新即使
                    clearTimeout(timer)
                }
                timer=setTimeout(function(){
                    console.log('被执行了')
                    fn.apply(this,arguments)
                },wait)
                
            }
}

节流

  • 指的是,一段时间内用户只能执行一次任务
  • 实现思路:setTimeout()
const tr=throttle(fn,wait){
   
     var lasttime=0
    // 闭包使得lasttime常驻内存
    return function(){
        var now=new Date()

        if(now-lasttime>wait){
            lasttime=now
            fn.apply(this,arguments)
    }
}
}

节流和防抖

标签:console   内存   deb   计时   ons   date()   常驻内存   art   设置   

原文地址:https://www.cnblogs.com/ailingstar/p/12322563.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!