자바스크립트 ES6의 const 상수 조금 더 알아보기

예전에 써 두었던 글을 보니 너무 오래되었고 부족한 부분도 많아 좀 더 정리하고자 적게 되었습니다.

# 상수는 무엇인가?

프로그래밍 언어에서 상수는 영어로는 constant, 사전적의미는 끊임없이 계속된다는 뜻으로 즉 같은 값이 계속 유지된다로 생각할 수 있습니다. 이와같이 같은 값이 계속 유지되기 때문에 상수로 값을 선언하는 경우 값이 변하는 변수(variable)와는 달리 값을 변경할 수 없게 됩니다. 즉 값이 변경되지 않아야 할 값이라면 상수를 사용하는 것이 좋습니다.

! 상수 선언의 방법, const

자바스크립트의 상수 선언 방법은 ES 6의 문법인 const를 사용합니다. 아래와 같이 말이죠.

위 예제에서는 const 선언 값으로 url 값을 사용하였는데요 ~ 실제로 웹어플리케이션을 만들 때 변하지 않는 데이터 값이라 생각할 수 있는 url 주소, 라우팅 주소, config 설정 값 등등이 상수에 선언되어 사용됩니다. 물론 변하지 않는 값을 var 또는 let으로 설정할 수 있겠지만 여러가지 요인으로 생각하지 못하게 값이 변할 수 있는 위험을 미리 방지하기 위함이기도 합니다.

상수의 특징은 그럼 뭐라고 할 수 있을까요? 가장 먼저 변하지 않는 다는 점이겠죠.
1. 값이 변하지 않는다
2. 블록 스코프를 가진다const는 let과 같이 블록 스코프 영역을 가지게 됩니다. es 5 이 전까지는 전역과 내부, 외부 스코프로 구분 될 수 있었지요 ~

! 값이 변할 수 있는 상수?

const로 상수한 값은 절대 변하지 않을까요? 이 역시 예외는 존재합니다. 바로 선언한 값의 타입이 참조 타입(reference value)인 경우입니다.

참조 타입은 아시다시피 메모리에 위치 값을 저장하게 됩니다. 이런 이유로 참조하여 저장된다는 뜻인데 이 때 메모리의 위치한 값이 변경될 경우 const로 선언된 값도 바뀔 수 있습니다. 이런 이유로 const의 값 역시 바뀌지 않도록 주의해야 할 필요가 있습니다...

@ 값이 변하는 상수의 예제
const로 선언하고도 주의를 해야한다니 뭔가 억울할 수 있습니다. 일단 어떤 경우에 바뀌는지 간단한 예를 알아봅니다.

위의 myName은 상수로 선언된 객체 값을 가지고 있습니다. 이 값의 first와 last를 서로 바꾸기 위해서 아래와 같이 입력해보겠습니다.

예상대로 에러가 발생합니다.타입에러로 상수에 값을 선언할 수 없기 때문이죠. 하지만 아래 방법은 어떨까요?

이제 값을 확인해보겠습니다. 어떻게 되었을까요?

상수 임에도 값이 변경되었음을 확인 할 수 있습니다. 이처럼 상수 역시 값이 변할 수 있다는 점을 알아두면 될 것 같습니다. 참고로 Array 역시 [0] 등의 index 값으로 접근할 경우 값이 변할 수 있으니 알아보세요.

! (참고) 데이터를 처리할 때 유용한 방법

데이터를 조작하는 일은 매우 어려운 일입니다. 특히 협업을 통해 여러사람이 동일한 어플리케이션을 만든다면 내부 코드를 작성할 때 선언된 값이 변경될 수 있는 위험도 있죠. 이를 피하기 위해서 상태 불변성(immutability)을 생각하면서 코드를 작성합니다.

상태 불변성은 선언된 값이 변하지 않고 그 상태를 계속 유지하는 것을 뜻합니다. 이를 위해서 상태가 바뀌지 않는 업데이트 방법을 사용하고 그 값을 그대로 사용하지 않고 값을 복사하여 사용합니다. 이때 얇은 복사가 아닌 깊은 복사(Deep Clone) 방법을 사용하죠.


여기까지 상수의 사용과 방법에 대하여 간략하게 알아보았습니다.