함수 표현식, 함수 선언식, 화살표 함수

함수 표현식

• 정의만 하고 실행하지는 않는 문장이다. 함수 선언으로 생성된 함수는 Function 객체로, Function 객체의 모든 속성(property), 메서드 및 행위 특성(behavior)을 갖는다.

• 함수 선언식은 수행결과가 존재하지 않는다. Javascript에서 함수 선언은 그 선언을 둘러싼 함수의 최상부나 전역 범위(global scope)로 끌어올려진다. 이렇게 끌어올려지는 것을 Hoisting(호이스팅)이라고 한다.

Function_Declarations();
function Function_Declarations() {
  	return 'Function_Declarations';
}

함수 선언식

• 실행이 가능한 함수가 변수에 할당 되는 것을 말한다.

• 여기서 함수 표현식과의 차이점은 Hoisting(호이스팅)이 안된다는 것이다. 아래 코드를 실행하면, TypeError가 발생하게 된다. 첫째줄에서 실행시킨 Function_Expression()이라는 함수는 정의된 적이 없기 때문이다.

Function_Expression(); 
const Function_Expression = function () {
    return 'Function_Expression'; 
}
// TypeError!

결론은 함수 표현식은 호이스팅이 되지만, 함수 선언식은 되지 않는다!

호이스팅이란?

• 정의
  Hoising이란 코드를 해석할 때 Global 영역에 선언된 코드블럭을 최상의 Scope로 끌어올리는 것을 말한다. 코드 순서에 상관없이 Global 영역에 선언되어 있는 변수, 함수의 선언문들을 먼저 모으고 Global 객체 속성으로 등록하는 것이다.

• 설명
  최상 Scope로 끌어올려져 Global 영역에 선언되면, 가장 먼저 해석되기 때문에 단순하게 선언문의 우선순위가 가장 높아진다고 생각하면 된다. 따라서 이 선언문들은 어떠한 위치에서도 실행이 가능하다. 한 가지 더 기억할 것은 선언은 hoisting되지만, 할당은 hoisting되지 않는다는 것이다.

• 단점
  많은 선언문이 남발되면, 선언문을 모으는 데 많은 시간을 쓰게 되어 실행코드는 점점 순위가 뒤로 밀리게 된다. 이런 경우 실행 시간이 길어질 수 있기 때문에 적당히 선언문을 사용하는 것이 중요하다.