手撸简单防抖与节流函数

防抖

防抖：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。
简单的说就是 每次执行都会初始化wait时间，疯狂执行也会在wait时间后执行

function   debounce(func,wait){
     let timer   // 申明定时器
 return function (...args){//args函数调用是传参
       let _args = args
      timer&&clearTimeout(timer) //当函数再次执行时，清除定时器，重新开始计时
   timer=setTimeout(()=>{
        func.apply(this,_args )  //apply更改this绑定和传参
     }, wait)   
  }
}

 function debounce(func,wait){
   let timer   //定时器
   return function (args){//args函数调用是传参
   let that = this   //获取作用域
   let _args = args
  timer&&clearTimeout(timer) //当函数再次执行时，清除定时器，重新开始计时
   timer=setTimeout(function(){
      func.call(that,_args )  //call更改this绑定和传参
     }, wait)   
  }
}

call与apply传参区别，箭头函数就不用保存this

节流

节流：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。
简单的说就是任你随意执行我会在我设定的wait时间执行一次（技能cd的意思差不多）

function throttle(func,wait){
   let run =true  // 通过闭包保存一个标记
  return function(){
      let args=arguments
    if(!run) return   // 在函数开头判断标记是否为true，不为true则return
        run=false   // 立即设置为false
    setTimeout(()=>{  // 当定时器没有执行的时候标记永远是false，在开头被return掉
     func.apply(this,args)  
       run =true   
    },wait)
   }
}