防抖函数封装

在某些场景我们并不需要高频的反馈，毕竟浏览器性能是有限的，不应该浪费在这里。

我们可以在第一次触发事件时，不立即执行函数，而是给出一个期限值，例如3000ms。

• 如果在3000ms 内没有次触发滚动事件，那么就执行函数
• 如果在3000ms 内 在次触发滚动事件，那么当前的计时取消，重新开始计时

效果：如果短时间内大量触发同一事件，只会执行一次函数

//防抖函数封装 参数1:函数 参数2:延时时间
function debounce(fn ,delay){
 var timer=null  //定义一个timer 为null
 return function(){
     //如果timer 存在就把它清除掉
     if(timer){
         clearTimeout(timer)
     }
     //如果这个timer 不存在就去执行这个函数
     timer=setTimeout(fn,delay)
 }
}


//使用
//监听窗口滚动事件
window.onscroll=debounce(scrollHandle,3000) //调用这个防抖函数

function scrollHandle(){
var scroolTop=document.documentElement.scrollTo;
}