앞서 살펴본 커링 구현 예제를 계속 살펴보도록 하겠습니다.
function calculate(a, b, c) {
return a * b + c;
}
function curry(func) {
var args = Array.prototype.slice.call(arguments, 1);
console.dir(args);
return function() {
return func.apply(null, args.concat(Array.prototype.slice.call(arguments)));
}
}
var new_func1 = curry(calculate, 9);
console.log(new_func1(2,3));
var new_func2 = curry(calculate, 9, 3);
console.log(new_func2(3));
앞서 정리한 내용까지 확인하였으면, 변수 args에 담기는 정보까지 확인이 되었습니다. 이제 그다음, curry 함수에서 리턴하게 되는 클로저 함수 라인을 살펴보도록 하겠습니다.
return function() {
return func.apply(null, args.concat(Array.prototype.slice.call(arguments)));
}
자, 다소 복잡해 보이지만 클로저를 잘 공부하신 분들이라면 차근차근 이해하실 수 있는 라인입니다. 우선, func 파라미터로 전달된 인자 값, 즉 함수 - 여기서는 calculate가 됩니다 - 를 apply를 통해 실행한 결과를 리턴하라는 함수가 정의되었습니다. 이 예제에서는 new_func1 이라는 변수에 curry 함수의 실행 결과를 대입하였습니다.
조금 복잡하지만, func.apply( ... ) 함수 부분을 해석해보면 다음과 같습니다. curry 함수에서 전달한 func인 calculate를 apply를 통해 실행한다는 의미가 되죠. 그리고 이때 첫 번째 인자 값은 null을 전달했습니다. 그리고 두 번째 인자 값은 다음과 같네요?
args.concat(Array.prototype.slice.call(arguments))
이것은 기존에 변수 args에 저장된 인자 값에 새롭게 전달된 인자 값을 붙여서 calculate의 파라미터에 새로 생성된 인자 값을 전달하여 실행하라는 의미가 됩니다. 자, curry를 실행하며 우리는 인자 값으로 calculate 함수와 정수 9를 전달해 둔 상태입니다. 그럼 args에는 9가 저장되어 있는 상태입니다. 그런데 예제에서는 new_func1(2,3)이라고 함수를 실행하였습니다.
결과적으로 calculate를 실행할 때, 인자 값으로 [9, 2, 3]이 전달된 것입니다. 9라는 값은 사실상 고정된 상태이고 여기에 사용자가 원하는 2, 3을 전달하여 a * b + c라는 연산이 실행된 것입니다. 결과적으로 출력되는 값은 9 * 2 + 3, 즉 21이 됩니다.
이러한 과정을 거치게 되면, 다음 라인의 결과 값과 작동 방식도 쉽게 예측할 수 있습니다.
var new_func2 = curry(calculate, 9, 3);
console.log(new_func2(3));
curry를 실행하며 calculate와 9, 3을 전달했습니다. 그럼 args에는 [9, 3]이 전달되었습니다. 그리고 new_func2를 실행하며 3을 인자로 전달했기 때문에 calculate 함수에는 [9, 3, 3]이 전달되어 9 * 3 + 3, 즉 결과 값은 30이 출력됩니다.
이러한 방식을 통해, 우리는 a * b + c라는 연산을 위해 전달하는 인자 값을 사전에 정의해두고, 원하는 값만 바꿀 수 있는 구조의 함수를 만들어낼 수 있게 되었습니다.
'Programming > Javascript' 카테고리의 다른 글
15. Javascript 함수형 프로그래밍 적용(2) - bind (0) | 2023.02.10 |
---|---|
15. Javascript 함수형 프로그래밍 적용(1) - 필수 선행지식 + 커링(curry) 3 (0) | 2023.02.09 |
15. Javascript 함수형 프로그래밍 적용(1) - 필수 선행지식 + 커링(curry) 1 (0) | 2023.02.06 |
14. Javascript 함수형 프로그래밍(5) - 피보나치 수열 구현하기 (0) | 2023.02.03 |
14. Javascript 함수형 프로그래밍(4) - 팩토리얼 구현하기 (0) | 2023.01.31 |