[JavaScript] 변수 재선언과 재할당 (var, let, const)

변수 재선언과 재할당 (var, let, const)

들어가며

• 자바스크립트의 변수(@var@, @let@, @const@)의 재선언과 재할당에 대하여 알아보자.

 

재선언과 재할당

① @var@

• 재선언 및 재할당이 모두 가능하다.

var sum = add(10, 20);
console.log(sum);    // 30
var sum = 100;       // 재선언 (가능)
console.log(sum);    // 100
sum = 200;           // 재할당 (가능)
console.log(sum);    // 200

 

• 하지만 @var@을 사용할 경우, 다음과 같이 호이스팅(Hoisting)이 발생할 수 있다.

var x = 10;
var sum = x + y;    // y 변수가 선언되기 전에 실행
var y = 20;
console.log(sum);    // NaN 출력 (y가 결정되기 전에 실행 되므로)

 

'y가 정의되지 않았다'라는 에러가 뜨지 않고, console.log(sum)의 결과가 NaN으로 출력된다. 왜냐하면 자바스크립트 해석기가 var sum = x + y; 부분이 실행되기 전에 var y;를 선언하여 sum의 값이 NaN으로 되었기 때문이다. (호이스팅 발생)

 

② @let@

• 재선언은 불가능하지만, 재할당은 가능하다.

let sum = add(10, 20);
console.log(sum);    // 30
let sum = 100;       // 재선언 (불가능) 
console.log(sum);    // Error: Identifier 'sum' has already been declared
sum = 200;           // 재할당 (가능)
console.log(sum);    // 200

 

③ @const@

• 재선언 및 재할당이 모두 불가능하다.

const sum = add(10, 20);
console.log(sum);    // 30
const sum = 100;     // 재선언 (불가능) 
console.log(sum);    // Error: Identifier 'sum' has already been declared
sum = 200;           // 재할당 (불가능) 
console.log(sum);    // Error: Assignment to constant variable.

 

정리

예약어	선언하지 않고 사용할 경우	재선언	재할당
@var@	오류 없음. (호이스팅 발생)	O	O
@let@	오류 발생	X	O
@const@	오류 발생	X	O