현대 자바스크립트(ES6
)이후 var
변수를 더 이상 사용하지 않는 것을 권장하고 있습니다. 그 이유는 var
변수의 여러가지 문제점이 있습니다. 이를 대체하기 위해서 let
과 const
변수를 새롭게 정의하게 되었습니다.
le
t과 const
를 사용 하기 전 두 변수의 용도를 먼저 알아보겠습니다.
let
은 저장소(스토리지
) 역할을 합니다. 그 이유는 재할당이 가능하기 때문입니다. 재할당이 필요한 경우에 한정해서 사용 할 수 있습니다.
const
은 let
과 달리 의도치 않은 재할당을 방지하기 위해 사용합니다. 다른 의미로는 특정 컨텍스트(해결하려는 문제) 하에서 미리 주어진 값을 의미합니다
const solution = () => {
const v = 10; // 상수 - 특정 컨텍스트(해결하려는 문제) 하에서 미리 주어진 값
let a = []; // 저장소 - 스토리지
for (let i = v; i >= 1; i--) {
a.unshift(i);
}
return a;
};
let
변수는 const
변수와 달리 초기화 할 필요가 없습니다. let
은 기본적으로 undefined
로 설정이 되어 있기 때문입니다.
let answer; // undefined
answer = 42; // 42
이는 var
변수와 동일합니다. var
변수도 기본 설정이 undefined
로 되어 있습니다.
var answer; // ndefined
answer = 42;
const
는 let
과 var
와 달리 초기화가 되어 있지 않습니다. const
를 사용 시 초기화를 해야 합니다.
const answer = 0; // 초기화
answer = 42; // Uncaught TypeError: Assignment to constant variable. => Google Chorme
다음 run 함수
를 실행하면 결과값은 어떻게 나올까요?
const run = () => {
let a;
for (let i = 0; i < 10; i++) {
a = i;
};
}
run();
다음 변수 a를 for 루프 안에서 선언을 하고 반환한다면 결과값은 어떻게 나올까요?
const run = () => {
for (let i = 0; i < 10; i++) {
let a = i;
return a;
};
}
run()
두 함수의 결과값은 다르게 나옵니다. 그 이유는 무엇일까요?
이를 확인 하기 위해서는 변수의 작동 방식을 알아야 합니다
변수(let
)과 상수(const
)은 비슷하게 동작합니다. 내부에는 식발자와 값의 저장소 가진 객체 속성을 가지고 있습니다. 이를 바인딩이라고 부릅니다.
let a;
a라는 식별자에 대한 바인딩을 만들고 해당 바인딩의 저장소 슬롯에 값을 undefined
를 저장합니다
변수와 상수에 따라 변경 가능한 바인딩 혹은 변경할 수 없는 바인딩으로 구분합니다.
식별자 바인딩은 객체 속성하고 비슷한 구조로 컨테이너를 가지고 있으며 환경 객체라고 부릅니다.
let x = 42;
바인딩 : {
식별자 : x
값 : 42
}
컨텍스트의 환경객체는 다음과 비슷합니다
let a = 1;
a의 바인딩 : {
식별자 : 'a'
값 : 1
종류 : 식별자
변경 가능 여부 : true
}
const b = 2;
b의 바인딩 : {
식별자 : 'b'
값 : 2
종류 : 식별자
변경 가능 여부 : false
}