1. 什么是防抖（debounce）
在事件被触发n秒后再执行回调函数，如果在这n秒内又被触发，则重新计时。
2 应用场景
(1) 用户在输入框中连续输入一串字符后，只会在输入完后去执行最后一次的查询ajax请求，这样可以有效减少请求次数，节约请求资源；
(2) window的resize、scroll事件，不断地调整浏览器的窗口大小、或者滚动时会触发对应事件，防抖让其只触发一次；
3 实现
import { useRef, useEffect, useCallback } from 'react'
export default function useDebounce(callback, delay = 250) {
const ref = useRef({ callback, timer: null })
useEffect(() => {
ref.current.callback = callback
}, [callback])
return useCallback(
function debounce(...args) {
if (ref.current.timer) clearTimeout(ref.current.timer)
ref.current.timer = setTimeout(() => {
ref.current.callback(this, args)
ref.current.timer = null
}, delay)
},
[delay],
)
}
