大前锋名匠公开赛中的千峰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.onmousemove=throttle(function(){ cont++; console.log("事件执行了"+cont+"次"); },1000)