자바스크립트 - 호이스팅

자바스크립트는 실행이 되기 전

코드 전체를 한번 parsing 하고

코드 내 정의되어있는 함수나 변수들을 기억해놓은다.

var v1 = "Hello";
console.log(v1);
var v2 = "World";
console.log(v2);

이와 같은 코드를 실행할 때

자바 스크립트는 변수 선언 부를 한번 확인하고 끌어올린다라고 생각하면 된다.

위의 코드를 호이스팅에서 다음 처럼 된다고 생각하면 된다.

var v1;
var v2;
v1 = "Hello";
console.log(v1);
v2 = "World";
console.log(v2);

{}블럭 내에서 유효하며 변수 뿐만아니라 함수선언문도 같다고 생각하면 된다.

run()
function run(){
  return "Hello World";
}

위와 같이 코드가 작성됬을 경우 호이스팅의 결과는 다음과 같다고 생각하면 된다.

function run(){
  return "Hello World";
}
run();

실제로 코드가 옮겨지는 것은 아니고 위와 같은 개념으로

코드를 한번 파싱했을 때 함수선언문이나 변수 명을 컴퓨터가 기억하고 있다가

해당 변수나 함수가 사용되면 그 내용을 꺼내서 쓴다고 생각하면 된다.

함수선언이 아닌 표현식을 사용할 경우 호이스팅을 하더라도 오류가 난다.

minus(3, 4);
var minus = function(a, b){
  return a - b;
}

이와 같은 코드를 호이스팅을 했을 때 다음과 같다

var minus;
minus(3, 4);
minus = function(a, b){
  return a - b;
}

변수로 선언된 함수표현식은 변수와 같은 방식으로 호이스팅 되기 때문에

함수가 아닌 상태로 함수식을 사용하기 때문에 오류가난다.

호이스팅의 우선순위는 변수 > 함수이다.

호이스팅이 되지 않는 let이나 const를 사용하여

가능하면 호이스팅이라는 개념을 모르더라도 사용할 수 있게 코드를 짜면 좋을것이다.