[Javascript] let, var, const 차이

var

• var는 함수 스코프(Function Scope)를 가집니다. 즉, 함수 내에서 선언된 경우 함수 내부에서만 유효하며, 함수 밖에서 접근할 수 없습니다. 하지만, 함수 외부에서 선언된 경우 전역 스코프(Global Scope)를 가집니다.
• var는 호이스팅되어, 선언이 코드 상단으로 끌어올려집니다. 하지만, 초기화는 원래 위치에서 이루어지므로, 선언 전에 사용하면 undefined 값이 됩니다.
• 재선언 가능: 동일한 스코프 내에서 var로 변수를 재선언할 수 있습니다.
• 재할당 가능: var로 선언된 변수는 언제든지 재할당할 수 있습니다.

console.log(x); // undefined (호이스팅 때문에 선언은 되었으나 초기화는 안 된 상태)
var x = 10;
console.log(x); // 10

var y = 5;
var y = 6; // 재선언 가능
console.log(y); // 6

let

• let은 블록 스코프(Block Scope)를 가집니다. 즉, 중괄호({})로 감싸진 블록 내에서만 유효하며, 블록 밖에서는 접근할 수 없습니다.
• let도 호이스팅되지만, 초기화 전에 접근하려고 하면 ReferenceError가 발생합니다. 즉, "TDZ(Temporal Dead Zone)" 내에서는 변수를 사용할 수 없습니다.
• 재선언 불가: 동일한 스코프 내에서 재선언이 불가능합니다.
• 재할당 가능: let으로 선언된 변수는 재할당이 가능합니다.

let a = 10;
a = 20; // 재할당 가능
console.log(a); // 20

let b = 5;
// let b = 6; // 오류: 동일 스코프 내에서 재선언 불가

if (true) {
  let x = 10;
}
console.log(x); // ReferenceError: x is not defined (블록 스코프 때문)

const

• const 역시 블록 스코프(Block Scope)를 가집니다. let과 동일하게 중괄호로 감싸진 블록 내에서만 유효합니다.
• const도 호이스팅되지만, 초기화 전에 접근하려고 하면 ReferenceError가 발생합니다. TDZ에 영향을 받습니다.
• 재선언 불가: const로 선언된 변수는 재선언할 수 없습니다.
• 재할당 불가: const는 상수로, 선언과 동시에 값을 할당해야 하며, 이후에는 재할당이 불가능합니다.
• 주의점: const는 객체나 배열의 경우 참조를 변경하지 않는 한 내부 값을 수정할 수 있습니다.

const c = 10;
// c = 20; // 오류: 재할당 불가
console.log(c); // 10

const obj = { name: 'Alice' };
obj.name = 'Bob'; // 객체 내부 프로퍼티는 변경 가능
console.log(obj); // { name: 'Bob' }

차이

스코프

var: 함수 스코프
let, const: 블록 스코프

호이스팅

var: 호이스팅 시 값이 undefined로 초기화
let, const: 호이스팅되지만 TDZ로 인해 초기화 전 사용 시 에러 발생

재선언

var: 재선언 가능
let, const: 재선언 불가

재할당

var, let: 재할당 가능
const: 재할당 불가