2021.11.18(函数节流防抖)

106 阅读1分钟

this.info = {...this.info,...dataObj}合并相同字段

函数防抖

let timer; 
const input = document.querySelector('input'); 
input.addEventListener('input', function() { 
    clearTimeout(timer); 
    timer = setTimeout(function() {
        // 执行具体代码 
    }, 500) 
})

场景:用户输入内容后间隔500ms自动保存(这么做可以防止过多次执行)

函数节流

// 点赞数 
let likes = 0; 
// 定时器标识 
let timer; 
/*
* 用户点赞函数 * 
*/ 
function clickButton() { 
    likes++; 
    if ( timer ) return; 
    timer = setTimeout(() => { 
        // 执行网络请求 
        // ajax... 
        
        // 点赞数重置 
        likes = 0; 
        // 重置timer 
        timer = null; 
    }, 300) 
}

场景:前端点赞模块节流