JavaScript의 debounce와 throttle의 차이점과 사용 사례를 설명해주세요.

면접관님, debounce와 throttle은 JavaScript에서 이벤트 핸들러의 호출 빈도를 제어하여 성능을 최적화하는 데 사용되는 기술입니다.

debounce는 특정 시간 동안 이벤트가 발생하지 않을 때, 마지막 이벤트 발생 시점의 함수를 딱 한 번만 호출합니다. 예를 들어, 검색어 자동 완성 기능에서 사용자가 입력을 멈춘 후에 검색 결과를 보여주는 데 유용합니다.

반면, throttle은 설정된 시간 간격 동안 함수가 최대 한 번만 호출되도록 합니다. 스크롤 이벤트 처리처럼 짧은 시간 간격으로 이벤트가 계속 발생하는 경우, throttle을 사용하면 함수 호출 빈도를 줄여 성능 저하를 방지할 수 있습니다.

핵심적인 차이는 debounce는 "마지막" 이벤트에 반응하고, throttle은 "일정 간격"으로 반응한다는 점입니다.