防抖debounce/ 节流throttle

防抖节流

防抖什么的非常简单

// 防抖什么的非常简单
function debounce(fn, delay) {
  let timer;
  return function (...args) {
    if (timer) {
      clearTimeout(timer);
    }

    timer = setTimeOut(() => {
      fn(...args);
    }, delay);
  };
}

// 立即执行防抖函数
function debounce2(fn, delay) {
  let timer;
  return function (...args) {
    if (timer) {
      clearTimeout(timer);
    }

    // 开始不一样了，timer只在开头结尾的时候为null
    // 只在哪时候才会执行函数fn;
    let callNow = !timer;

    timer = setTimeout(() => {
      timer = null;
    }, delay);

    if (callNow) {
      fn(...args);
    }
  };
}

节流也是非常的简单，节流就是减少触发的次数

//节流
  throttle(func, delay) {
      let status = true;
      return function(...args) {
        if (!status) return false;
        status = false;
        setTimeout(() => {
          func.apply(this, args);
          status = true;  
          // 只有当setTimeout里面的代码执行时，
          //也就是delay时间后status变为true才可再度执行func
        }, delay);
      };
    },
// 时间戳版
function throttle(fn, wait) {
  let previous = 0;
  return function (...args) {
    let now = new Date();
    if (now - previous > wait) {
      fn.apply(this, args);
      previous = now;
    }
  };
}