호이스팅

호이스팅은 개념적으로 말하면, 자바스크립트 엔진은 함수를 실행하기전 변수, 함수를 자바스크립트 내부적으로 제일 상단으로 올린다. 그 후 변수 선언, 함수 선언을 하여 자바스크립트에게 "자바스크립트야 나라는 존재가 있다는걸 기억해줘!"라고 알린다. 이러한 현상을 호이스팅이라고 한다.

var VS const, let

var와 const, let은 차이가 있다. var같은 경우는 호이스팅이 되어 변수가 선언되고, undefined값을 메모리에 할당하는 변수 초기화 과정까지 이루어진다. 반면에 const, let은 변수 선언만 된다.

TDZ(Templor Dead Zone)

const, let으로 변수를 선언 하였고, 아직 변수의 값이 할당 되지 않았을 때, 변수를 호출하면 Reference에러를 발생한다. 그래서, 변수가 할당 되기까지 영역을 TDZ이라고 한다

코드로 참고

	fucntion a(){
    	console.log('a');
    }
    
    const b = 0;
    var c = 5;
    
    function d() {
    	console.log('d');
    }
    
    var e = 10;
    let f = 55;
    
 	이러한 코드가 있다고 하자!
    자바스크립트 엔진이 실행이 되면 내부적으로 다음 같이 코드가 바뀐다고 생각하면 될거 같다
    
    var c;
    var e;
    
    fucntion a(){
    	console.log('a');
    }
    
    function d() {
    	console.log('d');
    }
    
    const b = 0;
    c = 5;
    
    e = 10;
    let f = 55;
    
    * var, 함수 표현식은 제일 위로 올라가고, var가 함수 표현식보다 호이스팅 우선순위이라서 더 위로 올라간다.
    * const, let은 호이스팅이 되긴 되지만, 이해를 돕기 위해 다음처럼 코드를 변환 한거다.
    * 이론적으론 모두 올라간다고 생각하되, 코드는 다음 처럼 된다고 생각하면 될거 같다.

결론

1. 자바스크립트가 실행되면 변수와 함수는 최상위로 호이스팅이 된다.
2. var는 선언과 초기화 까지 되고, const, let은 선언만 된다.
3. const, let의 각각의 변수가 할당 되기 전까지 영역을 각각 변수의 TDZ라고 부른다.