Javascript 의 기본적인 내용이자 Scope 와 관련된 중요한 개념이다.
Javascript 는 많은 프로그래밍 언어와 다르게 Block-level Scope 가 아닌 Function-level Scope 를 따른다.
Block-level Scope 가 모든 코드 블록의 유효성 판단을 선언된 코드 블록({}) 단위로 하는 데 반면, Function-level Scope 는 함수 단위로 Scope 의 기준을 잡는다.
Function-level Scope 의 중요한 특징은, 함수 내부에서 봤을 때 함수 외부는 Nested Scope 의 Outer function 이라 할지라도 Global 영역으로 취급된다는 점이다.
Hoisting 이란, Javascript 내에서 해당 변수 또는 함수의 "선언" 을 끌어올린다는 점이다.
여기서 주의할 점은 함수의 선언과 변수의 선언이 조금 다르다는 점이다.
위의 경우에 inner1 함수의 경우 정상적으로 호출이 된다. 해당 함수의 선언이 아래 있음에도 호출될 수 있는 이유는 해당 함수가 Hoisting 되기 때문이다.
반면 inner2 함수의 경우 Hoisting 되지 않는다. 그 이유는 변수의 선언과 함수의 선언이 다른 의미를 지니기 때문이다.
위와 같이 함수의 선언은 단순히 함수를 정의하면 되는데 반해 변수의 선언은 선언과 할당이 다르다.
이 때 의문이 생길 수 있다.
inner2 예제의 경우 "변수를 선언하고 함수를 할당한 것"이 아닌가?
정답은 "아니다." 이다. 정확히 예제의 inner2 의 경우 함수리터럴을 할당했다고 표현한다.
함수 리터럴이란 함수의 이름없이 구현체만 연결시키는 방식으로, 이 경우에 Javascript Engine 은 이를 호이스팅시키지 않는다.