防抖节流基础版

58 阅读1分钟

节流

逻辑:让一个函数触发有冷却时间

function throttle(fn,time,asThis) {
    //计时器
    let timer
    
    return function (...ars) {
    if(timer) return
    fn.call(asThis,...ars)
    timer = true
    setTimeout(()=>{
        timer = false
    },time)
}

一般用法:
EventTarget.addEventListener(type,throttle(console.log('传入触发的函数'),3000))

防抖

逻辑:让一个函数在某个事件停止一段时间后触发

function debounce(fn,time,asThis) {
    let timer
    return (...ars) => {
    if(timer) {
        clearTimeout(timer)
    }
    timer =  setTimeout(() => {
        fn.call(asThis,...ars)
        timer = null
    },time)
}

}

用法同上