函数节流和函数防抖JavaScript实现

函数节流

function throttle(fn, delay = 1000) {
  let Running = false;
  return function () {
    if (Running) {
      return;
    }
    Running = true;
    fn();
    setTimeout(function () {
      Running = false;
    }, delay);
  }
}

用法

function OnClick() {
  console.log('Clicked!');
}
let clicked = throttle(OnClick, 1000);

clicked();
//'Clicked!'
clicked();
clicked();

函数防抖

function debounce(fn, delay = 1000) {
  let timer = false;
  return function (arguments) {
    clearTimeout(timer);
    timer = setTimeout(function () {
      fn();
    }, delay);
  }
}

用法

function OnClick(){
    console.log('Clicked!');
}
let clicked = debounce(OnClick,1000);

clicked();
clicked();
clicked();
//'Clicked!'

猜你喜欢

转载自www.cnblogs.com/limbobark/p/10716326.html