[Udemy/CleanCode] 2.09 호이스팅 주의하기

• 호이스팅
  • 런타임(프로그램 동작 할 때) 환경에서 선언과 할당의 분리
  • 코드 작성 -> 스코프 예상
    • 런타임에서는 예상되로 동작하지 않음
    • 그 대표적인 예가 호이스팅 현상
  • var 로 선언한 변수가 초기화가 제대로 되어있지 않았을 때 최상단에 undefined 로 끌어올려 선언되어 지는 것

 

 

 

• 호이스팅 예시

var global = 0;

function outer() {
  console.log(global); // undefined
  var global = 5;

  function inner() {
    var global = 10;

    console.log(global); // 10
  }

  inner();

  global = 1;

  console.log(global); // 1
}

outer();

- outer 함수 내부에서 호이스팅 발생

- var 는 function scope

 

 

 

• 호이스팅 예시2

var sum;

console.log(sum()); // 3
console.log(typeof sum); // function

function sum() {
  return 1 + 2;
}

console.log(sum()); // 3

- 함수도 호이스팅 됨

- 함수 선언문으로 변수를 덮어씌움

 

 

 

• 호이스팅 예시3

var sum = 10;

console.log(typeof sum); // number
console.log(sum()); // sum is not a function


function sum() {
  return 1 + 2;
}

- 함수의 호이스팅 피하기

- 변수 선언 => 할당 => 초기화 완료 => 정확한 분리

 

 

 

• 요약
  • 호이스팅
    • 런타임 시, 선언이 최상단으로 끌어 올려짐
    • 코드를 작성 할 때 예측하지 못한 실행결과가 도출되어 문제 야기
  • 호이스팅을 피하기 위해, var 사용을 지양
    • const & let 사용
  • 함수도 호이스팅 됨 주의
    • 함수 표현식을 사용