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

const 키워드를 사용하여 선언된 변수는 재할당 할 수 없다. 즉, 변수에 새로운 값을 할당할 수 없다. 그러나 const로 선언된 객체나 배열은 수정 가능(mutate)하다. 그 이유는 const가 변수의 값 자체가 아니라, 변수가 참조하는 메모리 위치를 고정하기 때문이다.

 

아래의 예를 보자

const obj = { a: 1, b: 2 };

// 다음의 연산은 허용.
// 'obj'는 여전히 동일한 객체를 참조하고 있지만, 객체의 속성은 변경할 수 있다.
obj.a = 3; 
console.log(obj); // { a: 3, b: 2 }

// 그러나 다음의 연산은 허용되지 않는다.
// 'obj'를 완전히 다른 객체로 재할당하려는 시도.
obj = { a: 4 }; // TypeError: Assignment to constant variable.

마찬가지로 배열에 대한 예이다.

const arr = [1, 2, 3];

// 다음의 연산은 허용.
// 'arr'는 여전히 동일한 배열을 참조하고 있지만, 배열의 요소는 변경할 수 있다.
arr[0] = 4; 
console.log(arr); // [4, 2, 3]

// 그러나 다음의 연산은 허용되지 않는다.
// 'arr'를 완전히 다른 배열로 재할당하려는 시도.
arr = [5, 6, 7]; // TypeError: Assignment to constant variable.

결론적으로, const 키워드는 변수의 재할당을 방지하지만, 객체나 배열 같은 참조형 데이터의 경우, 내부의 속성이나 요소를 수정하는 것을 막지는 않는다. 이런 이유로 const로 선언된 객체나 배열의 속성이나 요소는 변경할 수 있다.