💻 오늘의 코드 팁 — Tap으로 함수 체인 중간에 로깅/디버깅 끼워넣기

문제

함수형 프로그래밍으로 데이터를 변환하다 보면, 중간 단계의 값을 확인하고 싶을 때가 있습니다.
```javascript
const result = fetchUser(id)
.then(user => enrichUserData(user))
.then(enriched => saveToDatabase(enriched))
// 여기서 enriched 값을 확인하고 싶은데?
// 체인을 끊고 중간 변수를 만들어야 하나?
```
체인을 끊으면 코드가 지저분해집니다.

해결책: Tap 패턴

Tap은 값을 받아서 사이드 이펙트(로깅, 디버깅 등)를 수행한 후, 같은 값을 그대로 반환하는 함수입니다.
```javascript
// Tap 구현
const tap = (fn) => (value) => {
fn(value);
return value;
};
// 사용 예제
const result = fetchUser(id)
.then(user => enrichUserData(user))
.then(tap(data => console.log('중간 상태:', data)))
.then(enriched => saveToDatabase(enriched));
```

실전 예제

배열 변환 중 디버깅:
```javascript
const users = getUserList()
.filter(u => u.active)
.map(u => ({ ...u, updatedAt: new Date() }))
.filter(tap(u => console.log(`처리 중: ${u.name}`)))
.map(u => u.id);
```
Promise 체인에서 조건부 로깅:
```javascript
const tapIf = (condition, fn) => (value) => {
if (condition(value)) {
fn(value);
}
return value;
};
fetchOrder(orderId)
.then(tap(order => console.log('주문:', order)))
.then(order => processPayment(order))
.then(tapIf(
result => !result.success,
error => console.error('결제 실패:', error)
))
.then(result => updateOrderStatus(result));
```
에러 로깅:
```javascript
const tapError = (fn) => (error) => {
fn(error);
throw error; // 에러 재발생
};
fetchData()
.catch(tapError(err => logger.error('API 호출 실패', err)))
.catch(handleError);
```

왜 좋은가?

1. 체인을 끊지 않음 — 함수형 스타일 유지
2. 디버깅이 쉬움 — 중간값을 언제든 확인 가능
3. 부작용 명시 — 로깅/디버깅이 순수 함수와 분리됨
4. 재사용 가능 — 같은 tap을 여러 곳에서 사용 가능

공식 문서

[Ramda.js - tap](https://ramdajs.com/docs/#tap) — 함수형 라이브러리의 표준 구현

[Lodash - tap](https://lodash.com/docs/#tap)

[JavaScript Promise 체이닝](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises#chaining)

2분 읽기 ✓