Mutable, Immutable

Mutable (가변적)

• 변경 가능한 데이터를 의미합니다.
• 한 번 생성된 데이터를 수정하거나 변경
• 객체나 배열과 같은 자료구조에 해당

특징

• 객체나 배열의 값을 직접 수정 가능
• 원본 데이터가 변경되면 해당 데이터를 참조하는 모든 곳에 영향을 미친다.
• 예상치 못한 부작용이 발생할 수 있으며, 복잡성이 증가할 수 있다.

const mutableArray = [1, 2, 3]
mutableArray.push(4) // 원본 배열 변경
console.log(mutableArray) // [1, 2, 3, 4]

Immutable (불변적)

• 변경 불가능한 데이터를 의미합니다.
• 한 번 생성된 데이터를 수정하지 않고 새로운 데이터를 생성하여 반환
• 원본 데이터의 보존과 예상치 못한 변경 방지

특징

• 데이터의 변경 대신 새로운 데이터를 생성하여 반환
• 원본 데이터는 보존되며, 변경 사항이 새로운 인스턴스에만 영향을 미친다.
• 함수형 프로그래밍과 함께 사용하면 부작용을 최소화하고 코드 예측성을 높일 수 있다.

const immutableArray = [1, 2, 3]
const newArray = [...immutableArray, 4] // 새로운 배열 생성
console.log(immutableArray) // [1, 2, 3]
console.log(newArray) // [1, 2, 3, 4]

활용

• 가변 데이터는 예상치 못한 부작용과 복잡성을 초래할 수 있으므로, 변경할 필요가 없는 경우에는 불변 데이터를 사용하는 것이 권장
• React와 같은 라이브러리는 불변 데이터를 활용하여 성능 최적화 및 UI 업데이트를 처리하므로, 상태 관리 시 불변 데이터를 활용하는 것을 추천