防抖和节流封装模块

防抖:当持续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次。如果设定的时间到来之前，又一次触发了事件，就重新开始延迟

/**
 * 函数防抖模块
 * 使用场景 搜索联想，window触发resize的时候，防止重复提交
 * @param Function func 触发的事件
 * @param Number delay 延迟时间
 * @param Boolean  flag 防抖效果后防抖 false 先防抖 true
 *
 *  */
export function debounce(func, delay, flag) {
  let timer;
  return () => {
    clearTimeout(timer);
    if (flag) {
      let bl = !timer;
      timer = setTimeout(() => {
        timer = null;
      }, delay);
      if (bl) {
        func();
      }
    } else {
      timer = setTimeout(() => {
        func();
      }, delay);
    }
  };
}

　　

节流：当持续触发事件时，保证一定时间段内只调用一次事件处理函数（例如:尿不尽）

 

/**
 * 函数节流模块
 * @param func 触发的事件
 * @param delay  延迟时间
 */
export function throttle(func, wait) {
  let previous = 0;
  return () => {
    let now = +new Date();
    if (now - previous > wait) {
      func();
      previous = now;
    }
  };
}

 

转载于:https://www.cnblogs.com/caoruichun/p/11145927.html