[Web] let, var, const의 차이

자바스크립트에서 변수 let, var, const의 차이를 알아보자. 

 

1. let

• 재할당 가능, 재선언 불가
• 블록 스코프

let은 재할당이 가능하고 변수의 중복 선언을 불가능하다. 그리고 블록 스코프의 특징이 있다. 여기서 블록 레벨 스코프란 let이 선언된 블록 (함수, if, for, while 문 등) 내에서만 유효하다는 것이다. 코드를 통해서 자세하게 확인해보자.

 

let test = ()=>{
    let n = 1
    if (n === 1){
        let num = 12
        console.log(num) // 12 출력
    }
    console.log(num) // num is not defined
}

test()

 

위의 코드처럼, 재할당이 가능하는 것을 볼 수 있다. 그리고 let이 선언된 블록을 벗어나서 num을 출력해보면 정의되어있지 않다는 오류를 볼 수 있는데, 이렇게 num이 해당 블록 내에서만 선언되었기 때문에 블록 밖에서는 사용할 수 없다는 것이 블록 스코프인것이다.

 

2. var

• 재할당, 재선언 가능
• 함수 스코프

var은 재할당과 재선언이 모두 가능하다. 그리고 함수 스코프의 특징을 가지고 있다. 함수 스코프는 변수가 선언된 함수 내에서만 유효하다는 것이다.

 

let test = ()=>{
    let n = 1
    if (n === 1){
        var x = 10  
    }
    console.log(x) // 10
}
console.log(x) // x is not defined

test()

 

이렇게 let과 다르게 함수 내에서 x가 선언되었다면 블록을 벗어나도 x는 유효하다. 하지마 함수를 벗어나게 된다면 x는 정의 되어있지 않다는 오류를 출력하게 된다. 참고로 var는 재선언이 가능하기 때문에 잘 사용하지 않는다고 한다. 왜냐하면 함께 코드를 작성할 때 문제가 생길 수 있기 때문이다.

 

3. const

• 재선언, 재할당 불가
• 블록 스코프

const는 재선언과 재할당이 모두 불가하다. 그리고 블록 스코프의 특징을 가지고 있다.

let test = ()=>{
    let n = 1
    if (n === 1) {
        const num = 1
        console.log(num) // 1 출력
        num = 2
        console.log(num) // TypeError
    }
}

test()

 

const는 이렇게 재할당이 불가능하다는 것을 확인할 수 있다.

 

📚 결론

특성	let	var	const
재선언 가능 여부	불가능	가능	불가능
재할당 가능 여부	가능	가능	불가능
스코프	블록 스코프	함수 스코프	블록 스코프