TIL - 20220714

 오늘은 모던 JavaScript 튜토리얼에서 오래된 'var'(https://ko.javascript.info/var)에 대해서 공부했다. var를 쓰면 안 된다라는 사실은 예전 JavaScript를 처음 배울 때부터 들었는데 그래도 var에 대해서 간단히라도 공부는 해놔야 할 것 같다는 생각이 들어서 공부하게 됐다. 작성한 질문은 다음과 같다.

 var로 선언한 변수는 함수 스코프 혹은 전역 스코프를 갖는다. 함수 스코프를 갖는 경우는 함수 안에 var를 선언했을 때이며, 나머지 경우에서는 전역 스코프를 갖는다. 예를 들어 if문 안에 var로 변수 선언을 해주었다면 let으로 했을 때는 undefined 에러를 만나게 되겠지만 var는 아닌 것이다.

 

 var를 쓰면 안 되는 이유 중 가장 큰 이유는 var는 재선언이 가능하다. 

let jaeyoon;
let jaeyoon; // SyntaxError: 'jaeyoon' has already been declared

let은 다음과 같이 같은 이름의 변수를 재선언하면 에러를 만나게 되지만, var은

var number = 1;
var number = 2;
alert(number); // 2

재선언을 해주어도 아무런 문제가 발생하지 않는다. 따라서, 개발자가 이미 만든 변수를 중복해서 만들어버릴 수 있으므로 var를 쓰면 안 된다.

 

함수 본문 내에서 var로 선언한 변수는 선언 위치와 상관없이 함수가 시작할 때 정의된다. var는 다음과 같은 코드가 에러 없이 동작한다.

function sayHi() {
  phrase = "Hello";
  
  alert(phrase);
  
  var phrase;
}
sayHi();

이렇게 변수가 끌어올려 사용되는 상황을 호이스팅이라고 하며 var로 선언한 모든 변수는 함수의 최상위로 끌어올려진다. 할당은 선언은 호이스팅되지만 함수는 호이스팅 되지 않는다는 점에 유의해야 한다.

 

var를 왜 쓰면 안 되는지에 대한 이유를 자세하게 알 수 있었던 점과 호이스팅이라는 개념을 배우게 되어서 좋았다. 호이스팅은 면접에서 물어보는 키워드라고 많이 들었는데 이젠 답할 수 있을 것 같다.