Vue防抖与节流的最佳解决方案

什么是防抖节流

防抖：防止重复点击触发事件防抖

首先啥是抖？ 抖就是一哆嗦！原本点一下，现在点了3下！不知道老铁脑子是不是很有画面感！哈哈哈哈哈哈
典型应用就是防止用户多次重复点击请求数据。
代码实现要点：设置一个定时器，通过闭包，抓住定时器变量，控制定时器的添加和清除
直接上代码
  function debounce(fn, time) {
      let _arguments = arguments
      let timeout = null
      return function () {
          if (timeout) {
              clearTimeout(timeout)
          }
          timeout = setTimeout(() => {
              fn.call(this, _arguments)
          }, time);
      }
  }

节流：指定时间间隔内只会执行一次任务

大家都玩过FPS游戏吧（没玩过？？？打枪知道了吧！）道具的射速是一定的，不会因为你点击鼠标的速度加快而增加。
代码实现要点：通过一个布尔变量作为状态，判断代码是否需要执行
直接上代码
  function throttle(fn, time) {
      let _arguments = arguments
      let canRun = true 
      return function () {
          if (!canRun) return
          canRun = false
          setTimeout(() => {
              fn.call(this, _arguments)
              canRun = true
          }, time);
      }
  }