[javascript] Throttle과 Debounce

Throttle

_.throttle 정해진 시간 간격으로 함수를 실행하도록 제한한다.

window.addEventListener(
  "scroll",
  _.throttle(function () {
    console.log("Scroll!");
  }, 400)
);

Debounce

_.debounce 정해진 시간 동안 함수가 실행되지 않으면, 함수를 실행한다.

async function getMovies(movieName) {
  const res = await fetch(
    `https://omdbapi.com/?apikey=7035c60c&s=${movieName}`
  );
  return await res.json();
}
const inputEl = document.querySelector("input");
inputEl.addEventListener(
  "input",
  _.debounce(async function () {
    console.log(await getMovies(inputEl.value));
  }, 400)
);