防抖：

案例：

搜尋時在輸入框輸入內容，頻繁的傳送請求

解決辦法：設定停止輸入一段時間之後再發送請求

沒有設定防抖

js程式碼

var text = document.getElementById('write');
function write() {
    console.log(text.value);
}
text.addEventListener('input',write);

效果:

會發現當我們不斷的輸入搜尋內容時會不斷的傳送請求

設定防抖

js程式碼：

var text = document.getElementById('write');
function denounce(fn,delay) {
    var timer;
    return function () {
        if(timer){
            clearTimeout(timer);
        }
        timer = setTimeout(function () {
            fn();
        },delay)
    }
}
function write(){
    console.log(text.value);
}
text.addEventListener('input',denounce(write,1000))

效果：

會發現當我們設定了防抖後停止輸入1秒後才會執行請求

但是這樣做也存在問題：當我們要不斷的高頻觸發一個事件時會導致事件無法觸發，比如滾動事件，當我們不斷的滾動頁面時，由於沒到延遲的時間，導致高頻時間不能被觸發。