let timer
//当前的this是指向window
return function (...args) {
//当前的this是指向dom元素
if (timer) {
clearTimeout(timer)
}
timer = setTimeout(() =>{
func.apply(this, args)
}, delay)
}
}
例：<div id="test">点击</div>
实现隔3s执行一次的操作：
document.getElementById('test').addEventListener('click', debounce(function() {
console.log('执行完成之后的动作')
}, 3000))
记：事件回调函数里的this指向触发当前事件的DOM元素
2022.3.19补充
节流函数的另一种实现方式：
两者的区别：
防抖函数：在一定时间内执行一个方法多次，只执行最后一次。因为在事件触发会先清理timer，如果时间间隔不到则会被清理掉，只有你的间隔到了之后才会执行，因此前面的函数都会被清理掉。
节流函数：在一定时间内执行一个方法多次，只有第一次生效。因为在事件触发后会先判断timer是否存在，只有不存在的时候才会执行。
相当于防抖是强制清理，节流是不到时间进不了大门。
答：不管触发多少次事件，都会等到事件触发 **n 秒后 **才会执行，如果在事件触发的 n 秒内 又触发了这个事件，那么就以新的事件的时间为准重新计算，总之，就是要等你触发事件 n 秒内 不再触发事件，我才会执行，一般用在用户表单输入实时搜索上
