[JavaScript] 변수선언 | var, let, const + 호이스팅

 

var

 var 키워드는 자바스크립트에서 가장 오래된 변수 선언 방식이다. var로 선언된 변수는 함수 레벨 스코프를 가지며,

호이스팅이 발생한다.

function example() {
  console.log(message); // undefined (호이스팅 발생)
  var message = 'Hello, JavaScript!';
  console.log(message); // 'Hello, JavaScript!'
}
example();

 var로 선언된 변수는 호이스팅이 발생하여 변수 선언이 해당 스코프의 최상단으로 끌어올려진다. 이로 인해 변수를 선언하기 전에 참조하게 되면 undefined 값을 출력한다.

 

 

 

 

let

 ES6에서 도입된 let 키워드는 블록 레벨 스코프를 가진 변수를 선언하는 데 사용된다. 또한, 호이스팅은 발생하지 않으나, 변수가 선언되기 전에 참조하려고 하면 에러가 발생한다.

function example() {
  console.log(message); // ReferenceError: message is not defined
  let message = 'Hello, JavaScript!';
  console.log(message); // 'Hello, JavaScript!'
}
example();

let 키워드를 사용하여 변수를 선언하면 더 안전한 코딩이 가능하며, 실수로 변수를 참조하기 어려워진다.

 

 

반응형

const

 const 키워드도 ES6에서 도입되었으며, 상수 변수를 선언하는 데 사용된다. 상수 변수는 한 번 값이 할당되면 변경할 수 없다. 또한 let과 마찬가지로 블록 레벨 스코프를 갖는다.

function example() {
  const message = 'Hello, JavaScript!';
  console.log(message); //Hello, JavaScript!'
  message = 'New Message'; // TypeError: Assignment to constant variable.
}
example();

 const 키워드는 값이 변경되지 않아야 하는 경우에 사용하는 것이 좋다. 이를 통해 코드가 안정적이고 예측 가능해진다. 

 

 

 

호이스팅

 호이스팅이란 자바스크립트에서 발생하는 특별한 현상으로, 변수와 함수 선언이 해당 스코프의 최상단으로 끌어올려지는 것을 의미한다.

var는 위에서 언급한것 처럼 호이스팅이 발생한다. let 값과 const로 선언된 변수 역시 호이스팅이 발생하지만, 안전성을 확보하기 위해서 개념상 임시 사각지대(Temporary Dead Zone, TDZ)에 의해 참조 에러가 발생하도록 설계되었다.

 

 변수 선언은 스크립트 또는 함수의 최상단에서 일관되게 하고, 함수 표현식을 사용해 나중에 호출 되는 함수를 강조하는 것이 좋다.