자바스크립트 - 데이터의 불변성

HELLO WORLD🙌·2020년 8월 7일
1

TIL

목록 보기
16/23
post-custom-banner

기본형 데이터와 참조형 데이터

변수와 상수를 구분짓는 변경 가능성의 대상은 변수 영역 메모리,
불변성 여부를 구분할때의 변경 가능성의 대상은 데이터 영역의 메모리이다.

기본형 데이터(숫자, 문자열, boolean, null, undefined, symbol)은 불변값이고,
참조형 데이터(객체, 배열)은 기본적인 성질은 가변값이지만 설정에따라 변경불가 할 수 있고 (Object.freeze등) 불변값으로 활용할 수 있다.

불변객체를 만드는 간단한 방법
immutable.js 같은 immer.js 같은 라이브러리 사용, ES6의 spread operator, Object.assign 메서드등을 활용할 수 있다.
객체의 얕은 복사, 깊은 복사에 대해서도 좀 더 공부해고 추후 글을 보완해가야겠다!

불변값이란?

var a = 'abc';
a = a + 'def';

예를 들어 변수 a에 기본형 데이터인 문자열 'abc'를 할당하고, 그다음 a에 'def'를 더하면
기존의 'abc'가 'abcdef'로 변하는 것이 아니라 새로운 문자열 'abcdef'를 만들어 그 주소를 변수a에 다시 저장하는 것이다. 'abc'와 'abcdef'는 완전히 별개의 데이터이다.

다른 변수에 abc를 할당하려면 이미 만들어져잇는 'abc' 데이터영역의 주소를 재활용한다. 변경은 새로 만드는 동작을 통해서만 이루어진다.

이렇게 만들어진 값은 가비지 컬렉팅(객체가 생성되었을 때 자동으로 메모리를 할당하고 쓸모 없어졌을 때 자동으로 해제시킴)을 당하지 않는 한 영원히 변하지 않는다.

var obj = {
	a: 1,
    b: 'b' 
};
obj.a = 2;

만약 변수에 객체를 저장한다면, 기본형 데이터와의 차이는 객체의 변수(프로퍼티)영역이 별도로 존재한다는 것이다. 객체의 변수 영역이 가르키는 데이터 영역은 불변값이지만, 변수에는 다른 값을 얼마든지 대입할 수 있다. 그래서 가변값이라고 하는 것이다.
a라는 이름의 변수영역이 가르키는 데이터영역의 주소는 바뀌었지만 obj라는 이름이 들어있는 메모리의 값은 변하지 않는다.

post-custom-banner

0개의 댓글