JavaScript防抖(debounce)和节流(throttle)

JavaScript防抖(debounce)和节流(throttle)

防抖
例如实时显示搜索框时,一定时间内只需要函数执行一次。

function debounce(fn,interval){
    let timeout = null;
    return function(){
    clearTimeout(timeout);
    timeout = setTimeout(()=>{
    fn.apply(this,arguement)
},interval)
}
}

节流
例如鼠标移动需要触发的函数,由于事件触发的频率过快,需要在一定时间触发一次函数,控制函数触发的频率。

function throttle(fn,interval){
    let canRun = true;
    return function(){
    if(!canRun)return;
    canRun = false;
    setTimeout(()=>{
    fn.apply(this,arguement);
    canRun = true;
},interval)
}
}

你可能感兴趣的:(学习笔记)