Throttle Explanation - JavaScript.ac

Problem Summary

Write a throttle function that limits how often a function can be called.

Detailed Explanation

이 문제는 **스로틀(throttle)** 패턴을 구현하여 함수 실행 빈도를 제한하는 방법을 학습합니다. ## 핵심 개념: 스로틀 스로틀은 일정 시간 동안 최대 한 번만 함수가 실행되도록 제한합니다. ### 접근 방법 ```javascript function throttle(fn, limit) { let lastCall = 0; return function(...args) { const now = Date.now(); if (now - lastCall >= limit) { lastCall = now; fn.apply(this, args); } }; } ``` ### 디바운스 vs 스로틀 ``` 디바운스: 마지막 호출 후 대기 시간이 지나면 실행 스로틀: 일정 간격마다 실행 (호출 중에도) ``` ### 시각화 ``` 호출: -X-X-X-X-X-X-X-X-----> 스로틀: -X-----X-----X-------> ^limit 간격으로 실행 ``` ### 실무 활용 - 스크롤 이벤트 처리 - 게임 루프 (FPS 제한) - API 요청 속도 제한 - 마우스 이동 이벤트 스로틀은 연속적인 이벤트에서 일정 간격으로 처리가 필요할 때 사용합니다.

Solution Code

solution.js

function throttle(fn, limit) {
  let lastCall = 0;
  return function(...args) {
    const now = Date.now();
    if (now - lastCall >= limit) {
      lastCall = now;
      fn.apply(this, args);
    }
  };
}

Key Concepts from This Problem

1. 스로틀

2. Date.now

3. 실행 빈도 제한

4. 성능 최적화

Common Mistakes

✗ 첫 호출을 즉시 실행하려면 lastCall 초기값을 조정해야 합니다

✗ 디바운스와 혼동하지 마세요 - 목적이 다릅니다

✗ trailing 호출이 필요하면 추가 구현이 필요합니다

Hints

Hint 1: 마지막 호출 시간을 기록하세요.

Complexity Analysis

Time Complexity

O(1)

Constant time regardless of input size

Space Complexity

O(1)

Uses almost no additional memory

Related Tags

#함수 #스로틀 #최적화