js防抖函数的使用

function debounce(func, delay) {
let timer
//当前的this是指向window
return function (...args) {
//当前的this是指向dom元素
if (timer) {
clearTimeout(timer)
}
timer = setTimeout(() => {
func.apply(this, args)
}, delay)
}
}

例:

点击

实现隔3s执行一次的操作:
document.getElementById('test').addEventListener('click', debounce(function() {
console.log('执行完成之后的动作')
}, 3000))

记:事件回调函数里的this指向触发当前事件的DOM元素

你可能感兴趣的:(js防抖函数的使用)