[JS] 함수 선언문은 '표현식인 문'인가?

(딥다이브 5.6 표현식인 문과 표현식이 아닌 문을 공부하며 든 의문)

 

일단 표현식과 문을 정리해보자.

표현식: 값으로 표현될 수 있는 문 (표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조함)

문: 프로그램을 구성하는 기본 단위이자 최소 실행 단위 (문의 집합: 프로그램)

 

표현식은 문의 일부일 수도 있고, 그 자체로 문이 될 수도 있다.

 

문은 표현식인 문과 표현식이 아닌 문으로 나뉜다.

- 표현식인 문: 값으로 평가될 수 있는 문

- 표현식이 아닌 문: 값으로 평가될 수 없는 문

 

표현식인 문과 표현식이 아닌 문을 구분하는 방법: 변수에 할당해보기

- 표현식인 문: 값으로 평가되므로 변수에 할당할 수 있다.

- 표현식이 아닌 문: 값으로 평가할 수 없으므로 변수에 할당할 수 없다. (에러 발생)

 

확인해보자.

1. 변수 선언문: 값으로 평가될 수 없다. 표현식이 아닌 문이다.

var foo = var x; // SyntaxError: Unexpected token var

2. 할당문: 그 자체가 표현식이다. 값처럼 사용할 수 있다. 표현식인 문이다.

var foo = x = 100;
// 할당한 값으로 평가된다. foo = 100.

 

여기까지 이해됨

근데 여기서 든 의문, 함수 선언문은 할당이 되지 않나? (아래와 같이 사용하는 걸 본 거 같아서)

var foo = function bar() { ... };

 

그래서 찾아봄

위에서 사용한 우항의 function bar() { ... }는 기명 함수 표현식이다.

(기명 함수 선언문의 우항과 형태가 같아서 헷갈렸던 것)

 

핵심 차이: 문맥에 따라 해석이 다름

자바스크립트는 문법적으로 function으로 시작하면 두 가지 방식 중 하나로 해석한다.

function bar() {}	함수 선언문	function 키워드가 문장(statement)의 맨 앞에 오면 → 선언문
		독립된 문장. 전역/블록 레벨에서 쓰면 선언문으로 인식됨
var foo = function bar() {}	(기명) 함수 표현식	= function처럼 표현식 맥락에 있으면 → 표현식
		변수에 할당되는 값. 전체는 변수 선언문 + 함수 표현식

 

- 끝 -

---

(여기부턴 추가로 찾아본 정보들)

 

(참고 1) 익명 함수 표현식 vs. 기명 함수 표현식

// 익명 함수 표현식
var foo = function() { ... };

// 무기명 함수 표현식
var foo = function bar() { ... };

함수 표현식은 익명 함수가 기본이지만

디버깅, 재귀 호출 등 특정 상황에서 더 명확하게 사용하기 위해 이름을 붙이는 경우가 생겼다.

이것이 기명 함수 표현식(Named Function Expression, NFE)이다.

 

기명 함수 표현식이 유용하게 쓰이는 경우를 확인해보자.

Error: 문제 발생 at foo (<anonymous>:2:9) 

→ 함수 이름이 foo로 찍혀서 어디서 문제인지 파악이 쉬움 (이름을 붙이면 디버깅할 때 함수 이름이 찍혀서 추적하기 편하다.)

 

(참고 2) 함수 표현식의 우항이 선언이 되나? - 아님!

예제로 확인해보자.

• bar는 함수 표현식을 할당한 변수이기 때문에 당연히 호출 가능하다.
• 하지만 foo()는 호출 불가. foo는 함수 표현식 내부에서만 유효하기 때문
• 이름 있는 함수 표현식은 디버깅을 위한 힌트로 주로 사용됨

 

 

FIN.