Hengxi's 개발 블로그

[JS] 다시보는 자바스크립트 - 함수형 프로그래밍 2 본문

개발/JavaScript

[JS] 다시보는 자바스크립트 - 함수형 프로그래밍 2

HENGXI 2022. 10. 20. 09:00

일급 함수 

일급 함수는 함수를 값으로 다룰 수 있는 개념을 말한다. 

 

1. 변수에 함수 담기

 

var f1 = function(a) { return a * a };

console.log(f1); // function(a) { return a * a }

자바스크립트에서는 위처럼 변수에 함수를 담을 수 있다.

 

2. 함수를 인자로 받기

function f3(f){
	return f();
}

console.log(f3(function() { return 10; })); // 10
console.log(f3(function() { return 20; })); // 20

f3 함수는 함수를 인자로 받아 함수 내부에서 함수를 평가 후 그 결과를 return 하는 함수이다. 

 

이러한 일급 함수라는 개념과 순수 함수라는 특징을 이용해서 함수의 조합성을 높여나가는 것이 함수형 프로그래밍이다.

 

즉, 언제 평가해도 상관없는 순수 함수를 많이 만들고, 그 순수 함수들을 값으로 들고 다니면서 필요한 시점(가장 적절한 시점)마다 평가를 하면서 다양한 로직을 만들어 나가는 것이 함수형 프로그래밍이다.

 

Add_maker

이러한 순수 함수와 일급 함수의 개념을 함께 이용해서 함수를 하나 만들어 보자.

 

function add_maker(a) {
	return function(b){
    	return a + b;
    }                         // 클로져
}

var add10 = add_maker(10);    // 일급 함수

console.log(add10(20));  // 30

일단 add10()을 실행하면 add_maker는 일단 10을 받게 되고, 내부 함수를 실행하고 종료된다. 이때 내부 함수가 클로져가 된다. 

 

간단하게 add_maker라는 외부 함수에서 값 a를 받았지만 내부 함수에서도 이를 기억하여 add 10(20)을 실행했을 때에 결과 값이 10 + 20인 30이 되는 것이다.

 

add_maker의 스코프에서 알고있는 a라는 값을 외부 함수(add_maker) 종료되어도 내부 함수에서 a를 기억할 수 있고 이것을 클로져라고 한다!

 

위에 add_maker 함수는 일급 함수라는 개념과 클로져라는 개념이 함께 사용된 예제이며, 순수 함수도 함께 활용되었다. 

 

그렇다면 위 코드에서는 어느 부분이 순수 함수가 활용되었을까??

add_maker 함수에서 받은 a 값은 내부 함수에서 사용하고 있는데 a의 상태를 직접 변경하고 있지 않다. 그렇기에 내부 함수는 항상 동일한 값을 가리키고 있는 a라는 값에 b를 더하는 순수 함수가 되는 것이다.

 

그래서 add10 이라는 함수를 add_maker를 통해 만들고 나면, 어느 시점에 add 10 함수를 평가를 하든 동일한 결과를 만들게 된다.

 

계속해서 말하고 있지만 다시 정리해보면, 함수를 값으로 다루면서 순수 함수를 정의하면서 그리고 함수의 평가 시점이 언제인지 상관없어서 다양한 방법으로 평가를 하는 것을 함수형 프로그래밍이라고 한다.

 

 

함수형 프로그래밍 사용 형태 알아보기

function f4(f1, f2, f3) {
	return f3(f1() + f2());
}

console.log(f4(
	function() { return 2 },   // 순수 함수
	function() { return 1 },
	function(a) { return a * a }));  // 9

위와 같이 순수한 함수들을 만들고 원하는 시점에서 조합하고 최종적으로 큰 로직과 결과를 만드는 f4 같은 함수들을 함수형 프로그래밍이라고 하는 것이다!

 

Comments