22.06.09

---

이 전 글에서 아래와 같이 언급한 바 있다.

변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 JavaScript 고유의 특징을 변수 호이스팅(Hoisting)이라고 한다.

Hoisting

console.log(score); // undefined

var score; // 변수 선언문

JavaScript 엔진은 콜스택 최상단에 위치한 실행컨텍스트의 코드를
실행하기 전에 코드를 쭉 훑으며 Lexical Environment의
environmentRecords에 식별자를 저장한다.
(매개변수, var, 함수 선언부 자체)

아니 이게 무슨 소리인가 싶다.
호이스팅에 설명하기 위해서 콜스택, 실행 컨텍스트, Lexical Environment, environmentRecords ... 에 대한 이해가 요구된다

후술하기로 하고

아무튼 JavaScript 엔진은 코드를 실행하기 전에 변수명을
다 알고있는 셈이다. (요게 핵심)

이렇듯 JavaScript 엔진이 변수의 선언을 '끌어올린' 것처럼 동작하는데
(실제로 끌어올리진 않음)
이를 '호이스팅(Hoisting)'이라고 부른다.

---

함수 선언문 VS 함수 표현식

앞서 언급한 호이스팅의 대상인 '매개변수, var, 함수 선언부 자체' 中,
함수 선언부에 대해 조금 더 다뤄볼까 한다.

함수 선언문

function funcName() {
  console.log('hello funcName');
  return 'funcName has called'
}

funcName();

• 접근이 쉽지만, 혼란을 야기할 수 있음
• 함수 선언문은 함수 선언 자체가 호이스팅되어 덮여쓰여지거나
  오류를 추적하는 데에 어려움이 있다.

함수 표현식

// 예시
var funcName = function () {
  console.log('hello funcName');
  return 'funcName has called'
}

funcName(); // 'A function expression'

• 함수표현식은 호이스팅이 되지 않는다.
• so, 함수 선언문보다 조금 더 방어적이라 협업, 실무환경에서 적합