简单防抖代码没看懂？

Question

function debounce(fn, wait) {
    var timeout = null;
    return function () {
      if (timeout !== null) clearTimeout(timeout)
      timeout = setTimeout(fn, wait)
    }
  }
  // 处理函数
  function handle() {
    console.log(Math.random())
  }
  //滚动事件
  window.addEventListener('scroll', debounce(handle, 2000));

第一个疑问debounce里面return 后接的函数可以不带函数名吗？
第二个疑问这个函数在这段代码里面会执行吗，return 只是返回了一个定时器函数，可是还没有调用它呢 ？
原文链接https://zhuanlan.zhihu.com/p/...

Answer 1

首先第一个问题...不带函数名无所谓, 因为就算有你也用不上, 执行之后只是把函数返回供你下一次直接调用...

第二个问题 确实没调用 但是你在滚动的时候触发的本身应该是个function 现在是个 debounce(handle, 2000) 这时候他就已经自己先执行了一下, 你每次滚动再去执行的function已经是他return出来的那个你所谓不带函数名的函数了

Answer 2

第一，return的那个function就是你执行debounce后的结果，带不带函数名在此处都可以
第二，你给window绑定scroll 事件的时候，执行了一次debounce，其实等于给window的scroll绑定的是return的那个function，这样就会让你的window的scroll持续调用，但是实际只会在2s内没scroll才会执行返回的那个方法。
我感觉你此处应该使用throttle的而不是debounce，个人理解

Answer 3

我觉得这个视频讲解很清楚：性能优化之防抖函数-沙翼-冰山工作室-web前端