함수 선언문과 표현식의 차이

1. 함수란?

• 함수는 자바스크립트에서 기본적인 구성 블록 중의 하나이며 어떤 작업을 수행하거나 값을 반환하기 위한 문(statement)의 집합을 정의한 코드 블록이다.
• 자바스크립트 함수는 다른 모든 객체처럼 속성과 메서드를 가질 수 있으므로 일급(first-class) 객체이다.
• 모든 함수는 Function 객체이다.
• 반환문이 없는 함수의 경우 기본 값을 반환한다. 기본적으로 함수는 undefined을 값으로 반환한다.
• 기본 값 이외의 원하는 값을 반환하도록 하려면 return 문으로 반환할 값을 지정해야 한다.
• new 키워드로 호출하는 생성자의 경우에만 함수의 “this“가 지정하는 값이 기본 값으로 반환한다.

2. 함수 선언문 (function declarations)

흔히 자바스크립트 함수 선언에서 볼 수 있는 구문이다.

function funcName() {
   return 'function declarations';
}

funcName(); // 함수 이름 호출문

3. 함수 표현식 (function expressions)

함수 표현식은 함수 선언문과 거의 비슷한 구문을 사용한다.
함수를 선언하지만 function 구문이 맨 처음이 아닌 경우가 함수 표현식이다.
주로 함수 이름을 생략하고 변수에 대입하는 익명함수(함수 리터럴을 사용해 변수에 참조값으로 할당하는 형태)의 형태로 자주 쓰인다.

const funcObj = function() {
   return 'function expressions';
}

funcObj(); // 함수 이름 호출문

위의 구문을 해석해보면 ‘function expressions’ 값을 반환하는 함수를 생성하고 그 함수를 변수 funcObj에 할당한다.

함수 표현식은 함수 선언문과 달리 호이스팅에 영향을 받지 않으므로 함수를 호출하기 전에 함수를 먼저 선언 후 호출해야 값이 반환된다.

• https://joshua1988.github.io/web-development/javascript/function-expressions-vs-declarations/
• https://ko.javascript.info/function-expressions