참조형 데이터 const 시 사용시 알아보기

const 란?

const 선언은 블록 범위의 상수를 선언한다. 상수의 값은 재할당 할 수 없으며 다시 선언할 수도 없다.

즉, const로 선언된 배열이나 객체의 경우, 해당 변수를 다른 값으로 재할당하는 것이 불가능하다. 또 다른 말로는, const로 선언된 변수에 다른 값을 할달하려고 하면 에러가 발생한다는 것이다. 하지만 배열이나 객체의 요소나 속성에 대한 수정은 가능하다.

배열, 객체를 const로 선언했는데 요소나 속성을 추가할 수 있는 이유

const는 변수 자체를 불변으로 만드는 것이 아니라 변수가 참조하는 값의 변경을 막는 것이기 때문이다. 배열이나 객체는 참조 타입이고, const로 선언된 변수나 참조하는 메모리 공간 자체는 변경되지 않는다. 따라서 변수나 참조하는 배열이나 객체의 요소나 속성은 여전히 변경 가능하다.

ex) const로 선언된 배열에 요소 추가

const arr = [1, 2, 3];
arr.push(4);
console.log(arr);// [1, 2, 3, 4]

ex) const로 선언된 객체에 속성 추가 및 속성의 값 변경

const obj = { a: 1, b: 2 };
obj.c = 3;
obj.a = 4;
console.log(obj);// { a: 4, b: 2, c: 3 }

하지만, const로 선언된 배열이나 객체의 참조를 변경하려고 하면 에러가 발생한다.

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
arr1 = arr2;// Error: Assignment to constant variable.

const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
obj1 = obj2;// Error: Assignment to constant variable.

아래의 그림은 참조형 데이터가 메모리에 참조되는 방법을 설명해준다.

 

 

const 란?

const 선언은 블록 범위의 상수를 선언한다. 상수의 값은 재할당 할 수 없으며 다시 선언할 수도 없다.

즉, const로 선언된 배열이나 객체의 경우, 해당 변수를 다른 값으로 재할당하는 것이 불가능하다. 또 다른 말로는, const로 선언된 변수에 다른 값을 할달하려고 하면 에러가 발생한다는 것이다. 하지만 배열이나 객체의 요소나 속성에 대한 수정은 가능하다.

배열, 객체를 const로 선언했는데 요소나 속성을 추가할 수 있는 이유

const는 변수 자체를 불변으로 만드는 것이 아니라 변수가 참조하는 값의 변경을 막는 것이기 때문이다. 배열이나 객체는 참조 타입이고, const로 선언된 변수나 참조하는 메모리 공간 자체는 변경되지 않는다. 따라서 변수나 참조하는 배열이나 객체의 요소나 속성은 여전히 변경 가능하다.

ex) const로 선언된 배열에 요소 추가

const arr = [1, 2, 3];
arr.push(4);
console.log(arr);// [1, 2, 3, 4]

ex) const로 선언된 객체에 속성 추가 및 속성의 값 변경

const obj = { a: 1, b: 2 };
obj.c = 3;
obj.a = 4;
console.log(obj);// { a: 4, b: 2, c: 3 }

하지만, const로 선언된 배열이나 객체의 참조를 변경하려고 하면 에러가 발생한다.

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
arr1 = arr2;// Error: Assignment to constant variable.

const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
obj1 = obj2;// Error: Assignment to constant variable.

아래의 그림은 참조형 데이터가 메모리에 참조되는 방법을 설명해준다.

 

정리해보자면, obj에 대한 주소값 @5002는 변하지 않는다. @5002의 값인 @7103~ 값들이 바뀌는 것이다.

그렇기 때문에 참조형 데이터의 주소값은 바뀌지 않고 그안에 데이터들이 변경되는 것이기 때문에, const를 사용해도 배열이나 객체와 같은 참조형데이터는 변경이 가능하다.

 

 

 

참조

코어 자바스크립트 - 정재남

https://suzzeong.tistory.com/130

const - 요소나 속성을 추가할 수 있는 이유