<자바스크립트 Javascript> 객체의 변경불가성(Immutability)

- 변경불가성이란?

함수형 프로그래밍의 핵심 원리로, 객체가 만들어진 이후에 상태를 변경할 수 없는 디자인 패턴을 뜻한다. 객체는 기본적으로 참조 형태로 운용되기 때문에, 그 상태가 언제든지 변할 수 있다는 위험성을 가지게 된다. 따라서 상태가 변경될 경우 객체가 존재하고 있는 장소에 변경 사실을 통지하고 대처할 수 있는 대응이 필요하다. 

 

이 대응 방법으로는 객체를 불변객체로 만들어 변경이 필요한 경우에는 객체의 방어적 복사(defensive copy)를 통해 새로운 객체를 생성하여 변경하는 방법이 있고, Observer 패턴으로 객체의 변경에 대처하는 방법이 있다. 다만 불변 객체가 많아지면 이는 또 다시 프로그래밍에 있어 부적절한 방법이 될 수 있다. 이에 ES6에서는 불변 데이터 패턴(immutable data pattern)을 쉽게 구현할 수 있도록 새로운 기능이 추가되었다.

 

 

- 변경 불가능한 값과 변경 가능한 값 비교

자바스크립트의 원시 타입은 변경이 불가능한 값(immutable value)이다. 이 외의 모든 값은 객체(Object) 타입으로, 변경 가능한 값(mutable value)이다. 여기서 변경이 불가능하다는 것은 메모리 영역에서의 변경이 불가능하며, 재할당은 가능한 것을 뜻한다.

 

 

- 불변 데이터 패턴(immutable data pattern)

앞서 객체의 상태가 언제든지 변할 수 있는 위험성에 대응할 수 있는 방법으로 불변 객체로 만드는 방법에 대해 언급하였다. 이를 정리하면 다음과 같다.

 

 

1) 객체의 방어적 복사(defensive copy) - Object.assign

타깃 객체로 소스 객체의 프로퍼티를 복사한다. 소스 객체의 프로퍼티와 동일한 프로퍼티를 가진 타깃 객체의 프로퍼티들은 소스 객체의 프로퍼티로 덮어쓰기가 이루어지며, 리턴 값으로 타깃 객체를 반환한다. ES6에서 추가된 메소드로 Internet Explorer에서는 지원되지 않는다.

 

Object.assign을 통해 기존 객체의 변경 없이 객체를 복사하여 사용이 가능하다. 다만, deep copy는 아니다. 객체 내부의 객체(Nested Object)는 Shallow copy가 된다.

 

 

2) 불변객체화를 통한 객체 변경 방지 - Object.freeze

불변하는 객체로 만들 수 있다. 또한 객체 내부의 객체도 변경이 가능하다. 객체 내부의 객체도 변경이 불가하게 만드려면 deep freeze가 필요하다.

 

 

- Immutable.js

사실 위 방법들은 번거로우며 성능상의 이슈로 큰 객체에는 사용을 권장하지 않는다. 따라서 그 대안으로 Facebook에서 제공하는 Immutable.js를 이용하는 방법이 있다. Immutable.js에서는 List, Stack, Map, OrderedMap, Set, OrderedSet, Record 등의 영구 불변(Permit Immutable) 데이터 구조를 제공하고 있다. npm을 사용하여 설치가 가능하다.

 

 

 

 

 

참고 : poiemaweb 웹사이트