🛠️ 처음부터 만드는 Throttle — 이벤트를 일정 시간 간격으로 제한하기

Throttle이란?

Throttle은 함수를 일정 시간 간격으로만 실행하도록 제한합니다. 마치 수도꼭지를 조절해 물이 일정 속도로만 나오게 하는 것처럼요.
Debounce와 헷갈리기 쉽지만, 차이는 명확합니다:

Debounce: 연속 호출이 끝난 후 한 번 실행

Throttle: 지정된 시간 간격마다 실행

구현

```javascript
function throttle(func, limit) {
let inThrottle;
return function(...args) {
if (!inThrottle) {
func.apply(this, args);
inThrottle = true;
setTimeout(() => (inThrottle = false), limit);
}
};
}
```

실제 사용

```javascript
const handleScroll = throttle(() => {
console.log('스크롤 위치:', window.scrollY);
}, 1000);
window.addEventListener('scroll', handleScroll);
```
사용자가 스크롤할 때 최대 1초마다 한 번만 실행됩니다.

타이밍 비교

```
사용자 클릭: ↓ ↓ ↓ ↓ ↓ ↓ ↓
Debounce: 결과: ------↓ (끝난 후)
Throttle: 결과: ↓---↓---↓ (일정 간격)
```

언제 쓸까?

스크롤/리사이즈 이벤트

API 검색 자동완성

버튼 연타 방지

실시간 데이터 업데이트

Debounce는 사용자가 입력을 멈출 때 기다리고, Throttle은 계속 응답하되 간격을 조절합니다.