节流与防抖

属于性能优化，提高用户体验的函数。如页面“上下”滚动监听、点击事件（避免多次触发）、表单输入验证等。

节流

• 限制回调在一定时间内只能执行一次，在计时内多次触发则“回调无效”，直到间隔结束才能触发新的回调

/**
 * 节流函数
 * @param {funciton} fn callback 回调函数
 * @param {number} delay 间隔多少毫秒，默认1500毫秒
 * @param {boolean} tips 操作过快提示
 * @eexample
 * utils.throttle(fn) 注意fn执行的是异步函数
 */
function throttle(fn, delay = 1500, tips = true) {
  let timer;
  return function () {
    if (!timer) {
      fn.apply(this, arguments);
    } else {
      //可添加弹窗提示用户
      return
    }
    timer = setTimeout(() => timer = null, delay)
  }
}

防抖

• 回调间隔控制，在一定时间内事件最多触发一次，若在时间多次触发则“重新计时”，计时结束才执行完成

function debounce(fn, delay = 500) {
  let timer = null;
  return function () {
    if (!timer) {
      fn.apply(this, arguments)
    } else {
      clearTimeout(timer)
    }
    timer = setTimeout(() => {
      timer = null
    }, delay)
  }
},

参考资料

• 详解防抖和节流函数：https://www.cnblogs.com/aurora-ql/p/13757733.html
• assets目录和static目录 - 博客园：https://www.cnblogs.com/xjy20170907/p/11766712.html