JavaScript에서 const로 선언한 객체, 정말 변경할 수 없을까요?

JavaScript에서 const 키워드로 선언된 변수는 새로운 값으로 재할당할 수 없습니다. 따라서 한 번 정의된 객체에 다른 객체를 할당하려고 하면 에러가 발생하고, 원래 값은 그대로 유지됩니다.

const로 객체 정의하기

먼저 const 키워드를 사용해 다음과 같이 객체 변수를 정의해 보겠습니다.

const details1 = {
    firstName: 'David',
    subjectDetails: { subjectName: 'JavaScript' }
}

예제 코드

아래 예제는 스프레드 연산자(...)를 사용해 기존 const 객체를 복사한 새로운 객체를 만들고, 복사본의 내부 속성을 변경하는 코드입니다. 이때 원본 객체인 details1의 값은 전혀 영향을 받지 않습니다.

const details1 = {
    firstName: 'David',
    subjectDetails: { subjectName: 'JavaScript' }
}
const details2 = { ...details1, subjectDetails: { ...details1.subjectDetails }, firstName: 'David' }
details2.subjectDetails.subjectName = 'Java '
console.log(details1);

프로그램 실행 방법

위 프로그램을 실행하려면 Node.js 환경에서 다음 명령어를 입력합니다.

node fileName.js

여기서는 파일 이름이 demo225.js라고 가정합니다.

실행 결과

위 코드를 실행하면 다음과 같은 출력 결과를 확인할 수 있습니다.

PS C:\Users\Amit\JavaScript-code> node demo225.js
{ firstName: 'David', subjectDetails: { subjectName: 'JavaScript' } }

정리

출력 결과에서 알 수 있듯이, 복사본인 details2의 subjectName 속성을 'Java'로 변경했음에도 불구하고 원본 객체 details1은 여전히 초기값인 'JavaScript'를 그대로 유지하고 있습니다. 이처럼 const로 선언된 변수는 재할당이 불가능하며, 스프레드 연산자로 만든 얕은 복사본을 수정해도 원본에는 아무런 영향을 주지 않습니다.