⭐️ Overview
현대 자바스크립트(ES6)이후 var 변수를 더 이상 사용하지 않는 것을 권장하고 있습니다. 그 이유는 var 변수의 여러가지 문제점이 있습니다. 이를 대체하기 위해서 let과 const 변수를 새롭게 정의하게 되었습니다.
let과 const의 용도
let과 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 변수는 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
}참고 사항
