防抖和节流

84 阅读1分钟

防抖就是蓄力,一直蓄力,控制只让它执行最后一次 比如说打字的时候,输入一个中文的时候,其实你是想等他把中文打出来再执行,但是其实在按下第一个字母的时候就执行了,但是只需要让它执行最后一次

节流就是一段时间内,不让他执行,只执行一次,时间均匀执行

function debounce(fn,delay)
{
    let t = null;
    return function()
    {
    clearTimeout(t)
    t = setTimeout(()=>{
         fn.apply(this,arguments)
    },dalay
    )
    }

}

这个是可以让他立即执行的版本,上面的第一次执行,必须要等delay

 function debounce(fn, delay, immediate) {
      let t = null;
      return function () {

        if (t) {
          clearTimeOut(null)
        }
        if (immediate) {
          let callNow = !null;
          if (callNow) {
            fn.apply(this, arguments)
          }
          t = setTimeout(() => {
            t = null;
          },delay)
        }
        else {
          t = setTimeout(() => {
            fn.apply(this, arguments)
          }, delay)
        }
      }

节流

  function throttle(fn,delay)
      {
        let begin = 0;
        return function(){
          let cur = new Date.getTime()
          if(cur - bigin >= dalay){
            fn.apply(this,arguments)
            begin=cur
          }
        }
      }

简单的做法