점 세 개(...)의 정체, Rest와 Spread 완벽 구분법

Context

JavaScript의 Rest와 Spread 연산자는 동일한 문법(...)을 사용함. 이로 인해 개발 과정에서 두 연산자의 사용 시점과 역할에 대한 혼동이 빈번하게 발생함.

Technical Solution

• Destructuring 과정에서 특정 필드를 제외한 나머지 데이터를 수집하는 Rest 연산자 설계
• 할당 연산자 좌측에서 나머지 값들을 Array 또는 Object 형태로 묶어내는 데이터 집계 방식
• 기존 Object나 Array의 내부 값을 개별 요소로 확장하여 전개하는 Spread 연산자 전략
• 할당 연산자 우측에서 기존 데이터를 복제하거나 새로운 필드를 추가하여 불변성을 유지하는 업데이트 구조
• 데이터의 '수집(Packing)'과 '확장(Unpacking)'이라는 상반된 동작 원리를 통한 역할 분리

Key Takeaway

데이터의 흐름이 '여러 개에서 하나'로 모이면 Rest, '하나에서 여러 개'로 펼쳐지면 Spread라는 방향성 기반의 설계 원칙을 적용함.