防抖节流以及this指向

/*

*防抖：防抖是指在事件触发n秒后在执行回调，如果在n秒内再次被触发，则重新计算时间

@param{function}fn 代表可能会频繁发生回调或ajax请求的函数

@param{number}delay 表示间隔多少毫秒才触发，默认100毫秒

*/

export function debounce(fn:Function,delay=200){//封装防抖函数触发是默认200

   let timer:NodeJS.Timeout|null=null//设置一个定时器为空

   return function(){

      if (timer) {//判断如果为空就启动定时器，在规定时间内再次点击就将定时器清除再重新开启，直到规定时间后再将定时器赋值为空

         clearTimeout(timer)

      }

      timer=setTimeout(()=>{

         fn.apply(fn,arguments)

         timer=null

      },delay)

   }

}

 

/*

*节流：节流是指如果持续触发某个事件每隔n秒只会触发一次

@param{function}fn 代表一个函数，里面可能会频繁发生回调或ajax请求

@param{number}delay 表示间隔多少毫秒才触发，默认200毫秒

*/

 

export function throttle(fn:Function,delay=100){//封装防抖函数触发是默认200

   let timer:NodeJS.Timeout|null=null//设置一个定时器为空

   return function(){

      if (timer) return判断如果为空就启动定时器，当定时器有值时就直接返回，在规定时间内再次点击也不会触发，规定时间后再将定时器赋值为空

      timer=setTimeout(()=>{

         fn.apply(fn,arguments)//因为在闭包中this指向的window，我们需要指向当前执行的函数fn

         timer=null

      },delay)

   }

}