[JS] 함수표현(Function Expressions)

함수 표현은 Function Literal(익명 함수; anonymous function) 이다. 이는 실행 가능한 코드로 해석 되어진다거나 변수나 데이터구조에 할당되어지고 있음을 의미한다. 즉, 해당 코드블럭이 실행코드로서 해석되어지며 동시에 코드실행에 따른 결과값을 가지거나 특정 변수에 할당된 값으로 존재한다.

​

​

이처럼 함수표현은 '함수 리터럴로 특정변수에 할당'되거나 '즉시 실행가능한 코드 블럭으로서 존재하는 함수'를 의미하는 것이다. 함수표현이 실행코드로서 해석되기 위해서는 ()를 이용하여 감싸주어야 한다. 이것을 자기호출함수(self invoking function) 라고도 한다. 자기호출함수는 재귀함수와는 다른 개념이다. 재귀함수는 함수 안에서 자신을 호출하는 형식이지만 자기호출함수는 해석과 동시에 실행되는 코드블럭을 말한다.

​

 

// anonymous function expression
var foo = function() {
    console.log('hello');
}

// named function expression
var foo = function foo() {
    console.log('hello');
};

// self invoking function expression
(function foo() {
    console.log('hello');
})();

 

 

위 코드에서 named function expression은 매우 특이하다. foo라는 변수에 이름이 있는 함수를 할당한다. 흔히 알고 있는 함수리터럴과는 조금 다르다. 하지만 이것에는 한가지 특징이 있다. 해당 함수의 이름은 함수 밖에서는 사용할 수 없다는 것이다.(변수에 함수 자체가 할당되어 있기 때문에!!)

 

 

var foo = function A() {
    A();  // 실행됨
}

A(); // Syntax Error!!!!

 

 

이와 같은 함수선언과 함수 호출 방법에서는 큰 차이가 없지만 호이스팅(hoisting) 관점에서는 큰 차이를 보이게 된다.

​

​

* 호이스팅(hoisting)

: Hoist란 단어의 사전적 의미는 '끌어올리기'라는 뜻이다. JS에서 끌어올려지는 것은 '변수'이다.

모든 변수 선언은 hoist 되며 이는 변수의 정의가 그 범위에 따라 선언과 할당으로 분리되는 것을 의미한다.(즉, 변수가 함수 내에서 정의되었을 경우 선언이 함수의 최상위로, 함수 바깥에서 정의되었을 경우 전역 컨텍스트의 최상위로 변경된다.)

​

​

​

:: 참고

http://insanehong.kr/post/javascript-function/