javascript hoisting이란?

이 부분은 실행 컨텍스트를 이해했을 때 더 정확한 개념적 이해가 가능합니다. 코드를 실행했을 때, 자바스크립트 엔진은 코드를 “평가”하는 과정을 거치는데요, 이때 실행 컨텍스트가 생성이 됩니다. 실행 컨텍스트는 “레코드”라는 공간에 먼저 선언된 변수와 함수 선언문들이 있는지 확인을 하고 있다면 먼저 정보들을 가져옵니다. var 키워드로 선언된 변수들은 선언과 동시에 암묵적으로 undefined로 할당이 됩니다. 이후 코드를 “실행’하는 과정에서 순차적으로 코드를 실행하면서 값이 할당됩니다. 예를 들어 var a = 1이라는 코드가 있다면 var a는 먼저 레코드에 등록이 되어있는 상태이고 1이라는 값은 실행하는 과정에서 코드가 한 줄씩 실행될 때 할당되는거죠. 그래서 코드를 실행할 때 함수를 선언하고 값을 할당하는 코드 전에 console.log(a)를 출력했을 때 undefined를 반환하는 것입니다. 이것을 변수 호이스팅이라고 하는 것입니다. 우아한테크코스 크루분들이 진행하시는 테크토크 영상인데요 실행 컨텍스트 내용 영상을 보시면 더 확실하게 이해가 가실거에요! :) https://www.youtube.com/watch?v=EWfujNzSUmw&t=791s

(참고 : https://imagineu.tistory.com/m/7) #1 console.log(a); #2 console.log(a); var a = 3; 위의 코드들을 실행해보시면 #1 코드는 에러가 나오고 #2 코드는 undefined 가 출력되는 것을 확인하실 수 있습니다. #2 코드는 이해하실 때 var a; // 호이스팅 console.log(a); a = 3; 이렇게 이해하시는 게 편할 것 같습니다. 저도 호이스팅이 발생하는 이유에 대해서 자세하게는 모르기 때문에 찾아본 결과, 제가 받아들이기로는 의도적으로 발생하는 것은 아니고 컴파일을 하는 단계에서 생기는 부작용 같습니다.

질문글에 올려주신 링크에 잘못된 내용이 있네요 let, const 도 전부다 호이스팅이 된답니다. 다만 let과 const 로 선언한 변수는 var 변수와 달리 변수의 생성과정에서 차이가 있기 때문에 TDZ의 영향을 받아 마치 호이스팅 되지 않는 것처럼 보이는겁니다. 자세한 내용은 제 블로그에 정리된 것이 있으니 링크 남겨드릴게요. https://data-study-clip.tistory.com/m/244