호이스팅

호이스팅?

자바스크립트에서, 변수의 선언을 항상 컨텍스트 내의 최상위로 끌어올리는 것을 의미한다. 이는 var 변수 선언과 함수선언문에서만 발생하고, 함수의 호출을 첫 줄에서 하고 마지막 줄에 함수를 정의해도 문제없이 작동되도록 하는 유용한 특성이다

부작용?

function sum (a, b) {
  var x = add(a,b);
  return x;

  function add (c, d) {
    var result = c+d;
    return result;
  }
}

위와 같은 코드가 있을 때 자바 스크립트는 아래와 같이 읽는다.

function sum (a, b) {
  var x = undefined;
  function add (c, d) {
    var result = c+d;
    return result;
  }

  x = add(a,b);
  return x;
}

변수의 경우 어디서 어떻게 선언을 하더라도 항상 컨텍스트내의 최상위로 끌고올라온 뒤 'undefined'를 할당해 둔다. 이후 함수 선언을 끌고 올라오고 난 뒤 변수의 할당과 함수의 실행문을 순서대로 가져오는 것이다.

ECMAScript 6판에서는 var나 function declaration대신에 추가된 let이라는 예약어를 사용하면 호이스팅을 막을 수 있다. 정확히 말하자면, let을 사용한다고 호이스팅이 일어나지 않는 것이 아나라, 호이스팅이 일어나 스코프 내 최상위로 끌어올려지지만, 'undefined'를 할당하지 않기 때문에 'undefined'가 출력되는 것이 아니고 참조에러가 발생하게 된다.따라서 실제 현업에서는 var 키워드는 절대로 쓰이지 않으며 99%이상의 경우 모든 함수를 무조건 const와 arrow syntax로 선언하게 되었다.

출쳐: 나무위키