본문 바로가기
Javascript

First-Class Functions

by kmmguumnn 2018. 4. 14.

함수는 First-Class다!

Javascript는 First-Class Function을 갖고 있다. 

Javascript의 함수는 First-Class이다.

무슨 뜻일까?


Javascript에서 함수는, 

1. 변수에 저장할 수 있고

2. 다른 함수의 인자(argument)로 전달할 수 있고(Callback function)

3. 함수의 리턴값으로 쓸 수 있다.


어떤 프로그래밍 언어이든 위의 세 가지가 모두 가능하면, 그 언어는 "First-Class Function"을 갖는다고 할 수 있다.

(First-class function - Wikipedia 참조)


First-class function이 의미하는 것은 즉, 일반적인 다른 data structure, 이를테면 숫자, string, object, 배열 등으로 할 수 있는 모든 것들을 함수를 통해서도 똑같이 할 수 있다는 것이다. 일종의 '값'(value)으로써 다뤄지는 것이다. 다음 코드를 보자.



average라는 함수가 선언되어 있고, 매개변수로 받은 세 개의 수들의 평균을 return한다. 여기에 .length를 적용해봤더니, 3이 나온다! 함수에 length를 적용한 것이 좀 이상하게 느껴지는데, 이상없이 뭔가가 출력된다.

이를 통해 알 수 있는 것은, function은 사실 object이기도 하다는 것이다.


하나 더 추가하자면, function은 'name'이라는 property도 갖고 있다. 



함수의 이름이 출력되었다.


정리하자면, 우리는 함수의 property에 접근할 수 있는데, 그 이유는 Javascript에서 function은 "first-class object"이기 때문이다.




함수는, 함수를 return할 수 있다


함수는 항상 어떤 값을 return한다는 사실을 알고 있는가? 그 값이 명시적(explicitly)으로 지정된 것(예를 들어 string, boolean, 배열 등등)이든, 혹은 함수가 암시적(implicitly)으로 'undefined'를 return하든, 함수는 항상 하나의 값을 return하게 되어 있다.


위에서 살펴보았듯이, 함수는 first-class 함수이기 때문에, 우리는 함수를 값(value)처럼 다룰 수 있고 다른 함수의 return값으로써 함수를 쓸 수 있다. 다른 함수를 return하는 함수를 "higher-order function"이라고 부른다(다른 함수를 매개변수로 받는 함수도 higher-order function이다). 다음 코드를 보자.



브라우저에서 alertThenReturn() 함수를 호출하면, 'Message 1!' alert이 뜬다. 뒤이어 내부의 anonymous function은 return은 되겠지만 'Message 2!'라는 alert이 뜨지는 않는다. 이는 내부 함수의 코드가 실제로 실행되지는 않았기 때문이다. 내부 함수까지 실행되게 하려면 어떻게 해야 할까?


alertThenReturn() 함수는 'inner function'을 return하기 때문에, 이 return 값을 변수에 할당해볼 수 있다.



innerFunction이라는 변수에 return value를 할당했다. 동시에, 'Message 1!' alert이 뜬다.



이제 innerFunction 변수를 다른 함수처럼 사용할 수 있다. alertThenReturn() 함수의 return 값이 할당된 것이니, innerFunction에는 alertThenReturn() 내부의 익명 함수가 들어있다.

innerFunction();

// 'Message 2!' alert이 뜬다.

재미있는 것은, alertThenReturn() 함수를 어떤 변수에 저장하지 않고서도 완전히 똑같은 결과를 얻을 수 있다. "higher-order function"에 괄호 쌍을 연속으로 두개를 붙여주면 된다.


alertThenReturn()();

// 'Message 1!' alert이 뜨고, 그 다음 'Message 2!' alert이 뜬다.

괄호 쌍 두개를 사용해 함수 호출한 것에 주목하자. 첫번째 괄호 쌍은 alertThenReturn() 함수를 실행한 것이고, 이 함수의 return 값 역시 함수(익명 함수)인데 이 함수가 두번째 괄호 쌍에 의해 뒤이어 호출되는 흐름이다.

댓글