cf) 초기화문이 있는 변수 선언문은 var
키워드가 없는 것처럼 동작하고, 초기화문이 없는 변수 선언문은 무시됨
var x = 1;
var y = 1;
var x = 2; // 기존 변수 값 변경
var y; // 무시됨
console.log(x, y); // 2 1
var
키워드로 선언된 변수는 코드 블록 내에 있더라도 전역변수가 되기 때문에, 변수의 중복 선언 가능성을 높임var x = 1;
if (true) {
var x = 10; // 전역변수 x 중복 선언
}
console.log(x); // 10
undefined
값으로 초기화 단계가 함께 실행되기 때문에 변수 선언문 이전에 변수를 참조할 수 있게됨// 런타임 이전에 변수의 선언 단계와 초기화 단계가 함께 일어남
console.log(foo); // undefined - 변수 참조 O
var foo;
console.log(foo); // undefined
foo = 1;
console.log(foo); // 1
var
키워드와의 차이점을 중심으로 살펴본다.
let foo = 1;
let foo = 2; // Uncaught SyntaxError: Identifier 'foo' has already been declared
let foo = 1;
{
let foo = 2; // 지역변수
let bar = 1; // 지역변수
}
console.log(foo); // 1
console.log(bar); // Uncaught ReferenceError: bar is not defined
var
키워드로 선언된 변수와는 달리 초기화 단계가 변수 선언문에 도달했을 때 실행됨. 따라서 변수 선언문 이전에서는 변수를 참조할 수 없게됨// 런타임 이전에 변수의 선언 단계가 일어남
// TDZ 시작
console.log(foo); // Uncaught ReferenceError: Cannot access 'foo' before initialization - 변수 참조 X
let foo; // TDZ 끝, 초기화 단계가 실행됨
console.log(foo); // undefined
foo = 1;
console.log(foo); // 1
var
키워드와 달리, let
키워드로 선언된 전역변수는 전역 객체의 프로퍼티가 아님var x = 1;
let y = 2;
console.log(window.x); // 1
console.log(window.y); // undefined
let
키워드의 특징을 공유하므로, let
키워드와의 차이점을 중심으로 살펴본다.
const foo = 1; // OK
const bar // Uncaught SyntaxError: Missing initializer in const declaration
const foo = 1; // OK
foo = 2; // Uncaught TypeError: Assignment to constant variable.
cf) 일반적으로 이름을 대문자로 설정
const TAX_RATE = 0.1;
let preTaxPrice = 100,
afterTaxPrice = preTaxPrice + TAX_RATE * preTaxPrice;
console.log(afterTaxPrice); // 110
const
키워드로 선언된 변수에 할당된 것이 객체라면 값을 변경할 수 있음. 객체를 변경할 때 재할당이 일어나지 않기 때문임const person = {
name: "J",
};
person.name = "H";
console.log(person); // {name: 'H'}
let
, 그렇지 않다면 const
를 사용함