해당 글은 '작성 중'이다.

함수 선언문과 함수 표현식을 구분하는 방법

선언문과 표현식을 구분하는 가장 쉬운 방법은 function이라는 단어가 구문에서 어디에 위치하는가를 살펴보면 된다.

• function이 구문의 시작 위치에 있는 경우 → 함수 선언문
• 다른 경우 → 함수 표현식

함수 선언문 예시

var a = 2;

function foo() {  // 함수 선언문
  var a = 3;
  console.log(a);  // 3
}
foo();

console.log(a);  // 2

함수 표현식 예시

var a = 2;

(function foo() {  // 함수 표현식
  var a = 3;
  console.log(a);  // 3
})();

console.log(a);  // 2

함수 선언문과 함수 표현식의 중요한 차이는 함수 이름이 어느 스코프의 확인자로 묶이느냐와 관련이 있다.

• 첫 번째 코드에서 함수 이름 foo는 함수를 둘러싼 글로벌 스코프에 묶이고, foo()라는 이름을 통해 직접 호출했다.
• 두 번째 코드에서 함수 이름 foo는 함수를 둘러싼 스코프에 묶이는 대신 함수 자신의 내부 스코프에 묶였다.

즉, (function foo( ) {...})라는 표현식에서 확인자 foo는 오직 ...가 가리키는 스코프에서만 찾을 수 있고 바깥 스코프에서는 발견되지 않는다. 이로 인해 함수 이름 foo를 자기 내부에 숨기면 함수를 둘러싼 스코프를 불필요하게 오염시키지 않는다.

---

📚 참고 자료

• 카일 심슨, 2017, 《You Don't Know JS: 타입과 문법, 스코프와 클로저》, 한빛미디어