5分钟搞懂js防抖,节流

防抖:其实就是按键连续(这个连续:在一定时间内)点击,只有触发一次事件.

节流:就是按键连续点击,事件均匀触发(按一定时间)

什么意思呢?

比如在百度输入框,我拼命连续按键,防抖就是你输入完后,最后才触发一次网络请求. 节流就是均匀隔一段时间请求网络

//防抖
function debounce(){
    let timer=null
    return ()=>{
        if(timer){
            clearTimeout(timer)
        }
        timer=setTimeout(()=>{
            console.log("防抖测试")
        },500)
    }
}

//节流
function jieliu(){
    let flag=true
    return ()=>{
        if(!flag) return
        flag=false
        setTimeout(()=>{
            console.log("节流测试")
            flag=true
        },200)
    }
}