const의 재할당

const 키워드

자바스크립트의 const는 상수를 표현하는데 사용한다.
상수는 재할당이 금지된 변수를 말한다.

const number = 1; // 선언 + 할당
number = 2; // TypeError: Assignment to constant variable.

그리고 const는 다음과 같은 특징을 볼 수 있다.

• const로 선언된 변수에 원시 값을 할당한 경우 값을 변경 할 수 없다.
• 하지만 객체를 할당한 경우 값을 변경할 수 있다.

요 문장들을 자바스크립트의 메모리 구조와 함께 알아보자

콜스택 / 힙 메모리

대부분의 자바스크립트 엔진은 크게 2개의 영인 콜 스택과 힙 메모리로 구분할 수 있다.

• 콜 스택은 원시 타입의 데이터가 저장된다.
• 힙 메모리는 참조 타입의 데이터가 저장된다.

다시 처음의 코드로 돌아가서 상수의 할당을 보자

const와 원시 타입

const number = 1;

변수 number에 값을 직접 대입하지 않고 한단계 거쳐가는 이유는 자유로운 데이터 변환과 효율적인 메모리 관리를 위해서이다.

메모리의 주소 값은 편의를 위해 간단하게 표현했다.

숫자 1은 원시 타입의 값이므로 콜 스택에 저장되고, 데이터 값이 저장된 주소 값은 변수 number에 저장된다.

주목해야 할 점은 const로 선언한 변수는 값이 저장된 메모리를 가리키는 포인터가 잠겨있다.

그러므로 const 변수에 원시 값을 할당한 경우 값을 변경할 수 없다.
즉, 재할당 할 수 없다.

const number = 1;
number = 2; // TypeError: Assignment to constant variable.

반대로 let과 var는 잠겨있지 않으니 값의 변경이 가능한 것이다.

const와 참조 타입

참조 타입의 데이터는 힙 메모리에 저장된다.
참조 타입의 데이터를 상수에 할당된 그림을 보자

const obj = {
  number: 1
}

주소가 @8001 ~???로 저장된 이유는 객체의 프로퍼티들을 저장하기 위한 메모리 영역은 필요한 시점에 동적으로 확보되기 때문이다.

마찬가지로 값이 저장되어있는 메모리를 가리키는 포인터는 잠겨있다.
재할당이 불가능한 것으로 객체에 대한 참조를 변경하지 못한다.

하지만 객체의 프로퍼티(변수) 영역이 별도로 힙 메모리에 존재하기 때문에 값을 변경할 수 있다.

객체 obj의 number 값을 2로 변경해보자

const obj = {
  number: 1
}

obj.number = 2;

마무리

const 변수의 재할당에만 초점을 맞춰서 생략 된것이 많지만 조금이나마 이해할 수 있게 되었다.

객체 내의 배열 같은 다음 단계도 공부해보자

참고

모던 자바스크립트 Deep Dive
코어 자바스크립트
드림코딩 by 엘리
https://curryyou.tistory.com/276