[JavaScript] 변수 선언의 실행 시점과 변수 호이스팅

https://youtu.be/VVErIOr4UBo?feature=shared

해당 글은 '모던 자바스크립트 Deep Dive'를 집필하신 분의 강의를 듣고 작성했습니다.

 

4.4 변수 선언의 실행 시점과 변수 호이스팅

-> 변수값의 참조를 변수 선언 이전에 하면 어떻게 될까? undefined

 

이런 것을 마치 변수를 위로 끌어올린다고 하여 변수 Hoisting이라 한다. 자바스크립트는 순차적으로 한줄 한줄 실행하기 이전에 선언문만을 먼저 실행한다.

 

자바스크립트는 line2부터 시작하는 것처럼 동작한다.

 

let, const는 변수호이스팅이 안된다.

 

4.5 값의 할당

-> 값을 저장하기 위해 메모리 공간을 확보한다.(다른 프로그램은 이 공간을 사용하지 못하도록 함.)

-> 이 메모리 주소를 score변수가 저장한다.

-> 자바스크립트 엔진에 의해서 암묵적으로 undefined 초기화 한다.

-> 초기화란 생성된 변수에 처음으로 값을 할당하는 것이다.

 

-> 0X00000F2에 undefined값을 지우고 0이 들어갈거라 생각이 들지만 그렇지 않음. undefined는 원시값(Data type)이라 변경불가능하다. 한 번 만들어진 원시값은 변경불가능하다.

-> score가 80이 들어있는 다른 메모리 주소를 저장한다.

-> undefined가 저장되어있는 주소는 없어져서 접근하지 못한다.

 

-> 변수호이스팅에 의해서 undefined 할당됨. 변수가 생성되면 암묵적으로 undefined 값에 의해서 초기화된다.

-> 한 줄 한 줄 실행되는 시점은 runtime이라 한다. 변수 할당은 runtime에 실행된다. 위 그림과 같이 hoisting에 의해서 undefined 였던 score가 새로운 메모리 공간을 가리킨다. 따라서 runtime에 score에 80이 할당된다.

-> 이 코드는 논리적으로 순서에 맞지 않다. 이렇게 쓰면 안됨.

 

[참고] : var x;와 같이 할당이 없는 변수 선언문의 경우 변수를  undefined로 초기화하지 않으면 어떤 일이 발생할까요? "모던 자바스크립트 deep dive"의 41쪽을 읽어보시면 도움이 될 듯합니다.

 

4.6 값의 재할당

 

 

var score = 80;

-> 첫 번째 문은 자바스크립트가 2개의 문으로 인식한다.

->

1. 메모리 공간을 undefined로 할당한다.

2. 새로운 메모리공간을 확보하고 80할당한다.

3. 이 주소를 score에 저장한다. 따라서 score를 참조하면 80을 읽을 수 있다.

 

score = 90;

-> 90을 새로운 주소에 저장하고 score에 이 주소를 다시 저장한다.

이를 값의 재할당 이라고 말한다.

 

재할당 불가능한 키워드는 const가 있다. 재할당 금지임.

ex)

-> TypeError : Assignment to constant variable

변경할 수 없다는 말은 할당된 값을 변경할 수 없다. 이 것이 상수이다.

 

[참고] : ** const a = { } 는 재할당 가능하다.