[JavaScript] 자바스크립트 변수 선언 방식

💫 var

var는 기존의 변수 선언 방식으로, 현재는 가급적 사용을 지양하고 있다.

특징:

• 함수 스코프(Function Scope):변수가 선언된 함수 내부에서만 접근 가능하며, 블록({}) 내에서 선언하더라도 블록을 무시하고 접근할 수 있습니다.
• 재선언 가능:동일한 이름의 변수를 중복 선언해도 오류가 발생하지 않습니다.
• 호이스팅(Hoisting):선언이 코드의 최상단으로 끌어올려지지만, 초기화는 선언 이후에 이루어집니다.
• 초기값 할당이 없어도 undefined로 자동 초기화.

function example() {
    if (true) {
        var x = 10;
    }
    console.log(x);  // 10 (블록 스코프 무시)
}

var a = 5;
var a = 10;  // 재선언 가능
console.log(a);  // 10

💫 let

let은 블록 스코프를 가지며, 재선언이 불가능하다.

특징:

• 블록 스코프(Block Scope):변수가 선언된 블록({}) 내에서만 접근 가능.
• 재선언 불가:같은 변수 이름으로 중복 선언하면 오류 발생.
• 호이스팅 발생하지만 초기화 전에는 사용 불가(일시적 사각지대, TDZ).
• 초기값 없이 선언 가능하며, 값 변경 가능.

function example() {
    if (true) {
        let x = 10;
        console.log(x);  // 10
    }
    // console.log(x);  // 오류 발생 (x is not defined)
}

let b = 5;
// let b = 10;  // 오류 발생 (재선언 불가)
b = 20;  // 값 변경 가능
console.log(b);  // 20

💫 const

const는 상수를 선언할 때 사용되며, 한 번 값이 할당되면 변경할 수 없다.

특징:

• 블록 스코프(Block Scope):let과 마찬가지로 블록 내부에서만 접근 가능.
• 재선언 및 재할당 불가:동일 이름으로 선언하거나 값을 다시 할당하면 오류 발생.
• 호이스팅 발생하지만 초기화 전에는 사용 불가(TDZ 존재).
• 선언과 동시에 초기화 필수.
• 객체의 경우 속성 변경은 가능하나 객체 자체 재할당 불가.

const c = 10;
// c = 20;  // 오류 발생 (재할당 불가)
// const c = 30;  // 오류 발생 (재선언 불가)

// 객체의 경우 속성 수정 가능
const obj = { name: 'Alice' };
obj.name = 'Bob';  // 가능
// obj = { name: 'Charlie' };  // 오류 발생 (객체 재할당 불가)
console.log(obj.name);  // Bob

💫 비교