[JavaScript] 함수

함수란

일련의 과정을 statement로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것

 

함수 리터럴

함수 리터럴은 함수 이름, 매개변수 목록, 함수 몸체로 구성되어 있다.

리터럴과 마찬가지로 함수 리터럴도 평가되어 값을 생성하며 이 값은 객체다.

하지만 일반 객체와는 다르게 함수는 호출할 수 있다.

 

함수 정의 방법

• 함수 선언문
• 함수 표현식
• 생성자 함수
• 화살표 함수

 

1. 함수 선언문

함수 리터럴과 형태가 동일하다.

차이점은 함수 선언문은 함수 이름을 생략할 수 없다는 것이다.

 

함수 선언문은 표현식이 아닌 문인데 변수에 할당할 수 있는 것처럼 동작한다.

이 이유는 자바스크립트 엔진이 코드의 문맥에 따라 함수 선언문 혹은 함수 리터럴 표현식으로 해석하기 때문이다.

함수 선언문이 값으로 평가되어야 하는 문맥(변수에 할당, 피연산자로 사용)에서는 함수 리터럴 표현식으로 해석한다.

 

함수 이름은 함수 몸체 내부에서만 유효하다.

function foo() { console.log('foo'); }
foo();

하지만 위의 코드를 실행했을 때 에러가 나지 않는 이유는 자바스크립트 엔진이 암묵적으로 foo라는 식별자를 생성하기 때문이다.

함수 객체를 가리키는 식별자가 없으면 함수 객체를 참조할 수 없기때문에 자바스크립트 엔진은 함수 이름과 동일한 이름의 식별자를 암묵적으로 생성하고 거기에 함수 객체를 할당한다.

이때문에 사실 위의 코드는 함수 이름인 foo로 함수를 호출하는 것이 아니라 식별자 foo로 함수를 호출하는 것이다.

 

2. 함수 표현식

함수 리터럴로 생성한 함수 객체를 변수에 할당하는 정의 방식

 

함수의 호이스팅

함수 선언문은 '표현식이 아닌 문'이고 함수 표현식은 '표현식인 문'이다.

이 때문에 함수 선언문으로 정의한 함수와 함수 표현식으로 정의한 함수이 생성 시점이 다르다.

 

함수 선언문은 변수 선언과는 다르게 undefined으로 초기화 되는 것이 아닌 함수 객체로 초기화 된다.

따라서 var 키워드를 사용한 변수는 선언문 이전에 참조할 경우 undefined를 반환하지만 함수 선언문은 선언 이전에 호출하면 호출이 가능하다.

 

함수 표현식은 변수에 할당되는 값이 함수 리터럴인 '문'이다.

따라서 변수 선언은 런타임 이전에 실행되어 undefined로 초기화 되지만 그 값은 할당문이 실행되는 시점에 평가되므로 함수 호이스팅이 아닌 변수 호이스팅이 발생하여 함수 표현식 이전에 참조할 경우 undefined를 반환한다.