var, let, const 차이(비교)

1. var ( 변수 재선언 가능 )

var variable = '변수선언함'; 
console.log(variable); //변수선언함 

var variable = '또 변수선언함'; 
console.log(variable); //또 변수선언함

 

var 는 같은 이름으로 재선언이 가능하다 

재선언이 가능하다 해서 장점이라고 생각이 될수도 있지만,

같은 이름의 변수명을 남용하는 문제를 일으킬 수 있다.

 

console.log(a)  
var a = 10 // undefined

 

위 코드를 실행하면 undefined가 출력된다.

이것은 호이스팅(Hoisting) 이 발생하여 아래에 코드 처럼

var a의 선언부가 위쪽으로 끌어 당겨져 발생하는 현상이다.

 

var a;
console.log(a) // undefined
a = 10;

 

 

2. let (변수 재선언 불가능, 변수 재할당 가능 )

let variable = '변수선언함'; 
console.log(variable); //변수선언함

variable = '변수는 재할당 가능'; 
console.log(variable); //변수는 재할당 가능

let variable = 'let은 또 변수는 선언 안되!!'; 
console.log(variable); //let은 또 변수는 선언 안되!!

 

위의 코드처럼 let은 변수의 재할당은 가능하지만 var처럼 재선언은 되지 않는다.

var 처럼 재선언 후 크롬 개발자도구에서 확인해본다면

아래 이미지 같은 에러문구 확인할 수 있다.

 

console.log(a)
let a = 10

위의 코드를 실행하면 다음과 같은 에러가 발생한다.

a가 아직 선언되지 않았다는 에러이다. 즉, 변수 호이스팅이 발생하지 않았다.

 

 

3. const ( 변수 재선언 불가능, 변수 재할당 불가능 )

const로 한번 선언된 상수는 재정의 할 수 없다.

const variable = '변수선언함'; 
console.log(variable); //변수선언함

variable = '변수 재할당함'; 
console.log(variable); //변수 재할당함(에러)

const variable = '또 변수선언함'; 
console.log(variable); //또 변수선언함(에러)

 

간단히 말해서 상수는 딱 한번 쓰고 (변수 재선언, 변수 재할당) 둘 다 불가능!!

 

console.log(a)
const a = 10

 

위의 코드를 실행하면 let과 같은 에러가 발생한다.

 

var	값 변경 O	호이스팅 O	재선언 O
let	값 변경 O	호이스팅 X	재선언 X
const	값 변경 X	호이스팅 X	재선언 X

 

javascript var, let, const 차이점