千峰老师前端性能优化之节流

大前锋名匠公开赛中的千峰root老师讲解了前端的性能优化之节流与防抖,这里是节流的方法。

节流:即在一定时间内减少事件执行的次数。

root老师是通过闭包的方式解决的节流问题。

code如下:

<div class="box"></div>

 

//通过函数闭包实现节流
function throttle(callback,wait){
    //设置上吃执行时间
    let prev = 0;
   //返回函数
   return function(){
        //获取当前时间戳
        let now = Date.now();
        //获取参数
        let args = arguments;
        //上一个时间与当前时间做判断
        if(now - prev > wait){//如果当前时间戳减去上一次执行的时间戳大于设置的时间数,就执行
            //设置this指向
             callback.apply(this,args);
            //更新执行时间
            prev = now;
       }
    }                    
}   

//获取元素
let box=document.querySelector(".box");

 //次数

let cont=0;

//设置事件
box.οnmοusemοve=throttle(function(){
   cont++;
    console.log("事件执行了"+cont+"次");

},1000)

  

  

 

转载于:https://www.cnblogs.com/xiaojianwei/p/10986064.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值