js防抖和限流

js防抖和限流

防抖

函数在300毫秒内触发就停掉定时器，只有在300毫秒后触发才会执行回调。

function debounce(callback,delay=300){
    var t = null
    return function(){
      clearTimeout(t)
      t = setTimeout(callback,delay)
    }
  }
  window.onscroll = debounce(function(){
    console.log('调用了一次');
  })

限流

函数只有在前后两次的时间大于500毫秒触发才会执行回调。

function throttle(callback,duration){
    var lastTime = new Date().getTime()
    return function(){
      var now = new Date().getTime()
      if(now - lastTime > 500) {
        callback();
        lastTime = now;
      }
    }
  }
  window.onscroll = throttle(function(){
    console.log('调用了一次');
  })