본문 바로가기
IT/web

[JS] forEach, "사이드 이펙트(side effect)"가 있을 때만 사용하자

by 내일은교양왕 2025. 7. 4.

용어 정리

side-effect (부작용) 함수가 실행 중에 외부 상태를 변경하는 행위 (예: 콘솔 출력, 변수 수정, API 호출 등) 
pure function (순수 함수) 입력 → 출력만 존재하고 외부 상태에 영향을 주지 않는 함수 (ex. map, filter 등에서 쓰는 콜백)

 

예제

// 사이드 이펙트를 map에서 쓰는 경우 (비추)
callbacks
  .filter(cb => typeof cb === 'function')
  .map(cb => cb());  // <-- 여기에 사이드 이펙트가 있음

 

이 코드는 cb()가 어떤 부작용(API 호출, 로그 등)을 일으키는 상황인데, map은 원래 "값을 변환해서 새 배열을 만드는" 용도이기 때문에 이 부작용이 코드 흐름 속에서 잘 드러나지 않고 가독성이 떨어진다는 뜻이에요.

 

위의 예제를 forEach를 사용한다면

callbacks
  .filter(cb => typeof cb === 'function')
  .forEach(cb => cb());

forEach는 반환값이 undefined라 "나는 뭔가 하려고 실행만 하고 끝낼 거야" 라는 의도가 분명해짐
즉, "여기서 부작용(side-effect)이 발생합니다!" 라고 코드 자체가 말해주는 것처럼 보여서 좋다는 의견입니다.

 

 

https://ntgard.medium.com/foreach-is-for-side-effects-60fca9f78850

 

forEach is for side-effects

The array method forEach is wonderfully useful, but I see it used in instances where other array methods are a better fit. For those who…

ntgard.medium.com