防抖debounce

应用场景，用户频繁操作，减少不必要的重复操作

const input = document.getElementById('input');
let timer  = null;
input.addEventListener('keyup', function(){
  if(timer){
    clearTimeout(timer);
  }
    timer = setTimeout(()=>{
      //这里执行频繁操作时间
      console.log(input.value);

      //记得清空定时器
      timer = null;
    },500)
})

封装的debounce

function debounce(fn ,delay = 500){
  return function(){
    if(timer){
      clearTimeout(timer);
    }
    timer = setTimeout(()=>{
        fn.apply(this,arguments);
        timer = null;
    },delay)
  }  
}

input.addEventListener('keyup',debounce(function(){
  console.log(input.value);
}),600)