-_-#【Better Code】throttle / debounce

时间:2022-12-10 11:12:07

浅谈javascript的函数节流

javascript函数的throttle和debounce

throttle 疯狂触发事件,固定步调执行

debounce 疯狂触发事件,不会执行

var resizeTimer = null
window.onresize = function() {
if (resizeTimer) {
clearTimeout(resizeTimer)
}
resizeTimer = setTimeout(function() {
console.log(1)
}, 500)
}
var debounce = function(func, threshold, execAsap) {
var timeout
return function debounced() {
var obj = this
var args = arguments
function delayed() {
if (!execAsap) {
func.apply(obj, args)
}
timeout = null
}
if (timeout) { // 时间少于threshold timeout一直clearTimeout 不会执行delayed
clearTimeout(timeout)
} else if (execAsap) { // 直接执行还是延迟执行
func.apply(obj, args)
}
timeout = setTimeout(delayed, threshold || 100)
}
} window.onresize = debounce(function() {
console.log(1)
}, 200, true)