‘변수는 재할당 가능하므로 변경 가능한거 아냐 ?’ 라고 생각할 수 있지만
JS에서 불변성을 말할 땐 변수 영역이 아닌 데이터 영역 메모리를 말합니다.
원시형
원시형의 데이터는 불변합니다.
let str1 = ‘abc’;str1 = ‘def’;
위의 코드는 메모리 관점에서 본다면 다음과 같습니다.
변수의 선언문은 런타임 전 실행 컨텍스트가 생성될 때 환경정보가 수집되어 L.E에 저장되는 것이고
값은 런타임시 평가돼서
데이터 영역에 메모리 공간을 확보하고 값 ‘abc’를 넣고
변수 영역에 메모리 주소를 저장합니다.
변수를 사용시 변수가 참조하고 있는 메모리주소 1011에 가서 값 ‘abc’를 찾는것 입니다.
새로운 값을 할당하면 새로운 메모리 공간을 확보하고 값을 넣고
변수 영역에 메모리 주소를 저장합니다.
‘abc’를 직접 수정하지 않고 새로운 메모리 공간을 확보하고 값을 넣는다는점에서
원시형은 불변성을 갖습니다.
그리고 더이상 ‘abc’를 참조하는 변수가 없다면 가비지 컬렉터의 수집대상이 되어 메모리에서 해제될 것 입니다.
참조형
반면에 참조형은 변경 가능합니다.
객체의 프로퍼티를 동적으로 변경한다면
변수가 가리키고 있는 데이터 영역의 메모리 주소는 동일하게 됩니다.
객체는 원시형처럼 데이터 영역에 값이 바로 저장되지 않습니다.
변수 영역에 메모리 공간을 확보하고
데이터 영역에 변수 영역의 메모리 주소를 저장하고
데이터 영역에 ‘rice’ 값을 넣은 후 변수 영역에 데이터 영역의 메모리 주소를 저장합니다.
값을 동적으로 변경시에는
데이터 영역에 메모리 공간을 확보하고 값을 대입한 후
obj.food가 가리키고 있는 메모리 주소를 @2100 -> @3000으로 변경해줍니다.
속성의 값을 변경했음에도 변수가 가리키고 있는 데이터 영역의 메모리 주소는 @2000으로 동일한 것을 볼 수 있습니다.
참조형도 원시형처럼 food 가리키고 있는 @2100의 ‘rice’를 ‘hamburger’로 값을 직접 변경하지 않고 새로 메모리 공간을 확보하고 값을 저장 한다는 점에는 동일하지만
객체의 속성 값을 변경되었음에도 변수가 가리키고 있는 데이터 영역의 메모리 주소는 동일하므로 참조형은 원시형과 달리 변경 가능한 값이라 하는 것입니다.
