真正的防抖函数怎么写？

记录一个简单的防抖函数，主要是面试过一些人的防抖实现，感觉都提不到最后一点

看过很多人写的防抖，但是都没有记录最后状态，那真正的防抖应该怎么实现呢？

假设有一个滚动条滚动然后执行某个事情的需求

我们需要根据滚动条的高度来执行某些事情

let timer = null
let needExecute = false

const handleScroll = () => {
  needExecute = true
  if (timer) return

  timer = setTimeout(() => {
    needExecute = false
    if (document.scrollingElement.scrollTop > 20) {
        // doSomething
    }
    timer = null
    if (needExecute) handleScroll()
  }, 50)
}

window.addEventListener("scroll", handleScroll)

这个函数的意义在于，每次如果有 timer 会不执行函数，而且在时间函数执行完毕的时候，检查是否需要再次执行一次，如果需要，则再次调用自己，来执行最后一个保留的位置

如果需要传递参数，就把 needExecute 改为传入的参数，这样保留上次传递的参数。

标签：防抖,函数,timer,handleScroll,needExecute,执行,真正
来源： https://blog.csdn.net/weixin_42335036/article/details/122585847