떨림 방지 & 절류 함수의 실현

떨림 방지와 절류 함수는 매우 기초적인 도구 함수라고 할 수 있다. 개인의 간단한 이해를 말해 보자.

떨림 방지: 사용자 조작은 일정한 시간을 기다린 후function을 실행합니다. 만약에 사용자가 대기 시간 범위 내에서 반복 조작을 한다면 대기 시간을 다시 계산합니다(시전 흔들림 시간이 있는 것과 같습니다. 만약에 기술을 반복 방출하면 기술 전 흔들림 다시 계산합니다.)

절류: 사용자의 빈번한 조작하에서function은 반드시 일정한 시간 간격을 거친 후에야 실행할 수 있습니다. 예를 들어 10초마다 실행할 수 있습니다.냉각 시간이 있는 function에 해당한다

구현:

떨림 방지:

function debounce(fn, wait) {
  var timer = null;
  return function() {
    //  ， 
    if (timer) {
      clearTimeout(timer);
      timer = null;
    }
    //  ， 
    timer = setTimeout(() => {
      fn.apply(this, arguments);
    }, wait);
  };
}

흐름을 줄이다

function throttle(fn, delay) {
  var preTime = Date.now();

  return function() {
      var nowTime = Date.now();
    //  ， 。
    if (nowTime - preTime >= delay) {
      preTime = Date.now();
      return fn.apply(this, arguments);
    }
  };
}