JavaScript에서의 데이터타입 4 _불변객체

JavaScript에서의 데이터타입 4 _불변객체

코어 자바스크립트(정재남 저) 책을 기본으로 하여 자바스크립트를 공부하면서 내용을 정리하고자 한다.


01 데이터타입



👨🏻‍💻 불변 객체

불변 객체는 어떤 경우에 필요한 것일까?


다음의 예시를 살펴보자.

immutableObj1

1. player 변수 안에 객체를 생성하여 할당하였다.

2. 이름만 변경하는 함수 changeName을 작성하고, player2 변수에 이름을 바꾼 객체를 할당하였다.

player의 값은 변경하지 않고, 이름만 변경한 새로운 데이터를 player2에 입력하고 싶었으나

출력 결과는 player, player2의 이름이 모두 변경됨을 알 수 있다.

player와 player2의 값은 같은 주소값을 가리키고 있기 때문에

위의 함수 changeName를 사용하면 해당 주소값에 연결된 데이터 객체가 변경된다.

객체 내부의 프로퍼티만 바꾸는 참조형 데이터의 가변성의 예라고 볼 수 있다.


그럼, 의도대로 player의 값은 변경하지 않고, player의 값을 기준으로 player2의 name 값만 바꾸려면 어떻게 해야 할까?


이러한 경우 사용되는 것이 `불변객체`이다.


다음은 객체 가변성을 해결하는 불변 객체를 만드는 예시이다.

immutableObj2

위와 같이 코드를 수정하면,

player의 값을 고정값으로 설정하고, 함수 changeName를 통해 이름만 변경된 새로운 객체를 생성하여 사용할 수 있다.

그러나, 위의 코드는 이름을 제외한 나머지 프로퍼티들을 하드 코팅하여 효율성이 떨어진다.

객체의 프로퍼티가 훨씬 많다면 너무 비효율적인 코드가 된다.


효율적인 불변 객체 만들기

불변 객체를 만드는 방법 중 많이 사용되는 것이 얕은 복사 를 하는 방법이다.

immutableObj3


좀 더 간단한 방법도 있다.

내장메소드 Object.assign을 쓰면 좀 더 간단한 얕은 복사가 가능하다.

immutableObj4


코드 참고하려면


👉🏻 다음 장에서 이어서 설명 👉🏻 Next Page