[JavaScript] 커링 함수

YJ·2023년 7월 5일
0

커링 함수(currying function)란 여러 개의 인자를 받는 함수를 하나의 인자만 받는 함수로 나눠서 순차적으로 호출될 수 있게 체인 형태로 구성한 것을 말한다.

// 예제 1
var curry = function (func) {
  return function (a) {
    return function (b) {
      return func(a, b);
    };
  };
};

var getMaxWith10 = curry(Math.max)(10);
console.log(getMaxWith10(8));     // 10
console.log(getMaxWith10(25));    // 25

커링에는 몇 가지 특징이 있다.

  • 커링은 한 번에 하나의 인자만 전달한다.
  • 중간 과정상의 함수를 실행한 결과는 그 다음 인자를 받기 위해 대기만 할 뿐이고, 마지막 인자가 전달되기 전까지는 원본 함수가 실행되지 않는다.
  • 인자가 많아질수록 가독성이 떨어질 수 있다.

다행히 가독성 문제는 화살표 함수를 써서 한 줄로 간단하게 표기할 수 있다(ES6).

// 예제 2
var curry2 = function (func) {
  return function (a) {
    return function (b) {
      return function (c) {
        return function (d) {
          return function (e) {
            return func(a, b, c, d, e);
          };
        };
      };
    };
  };
};

var getMax = curry2(Math.max);
console.log(getMax(1)(2)(3)(4)(5));    // 5개의 인자만 받았지만 13줄이나 소모


// ES6
var curry2 = func => a => b => c => d => e => func(a, b, c, d, e);     // 화살표 함수를 써서 간단하게 작성

커링 함수를 유용하게 사용할 수 있는 경우

함수형 프로그래밍에서 원하는 시점까지 함수의 실행을 미뤄두는 것을 지연실행(lazy execution) 이라 한다.
함수의 매개변수가 항상 비슷하고 일부만 다를 경우에도 커링을 이용해 지연실행 시킬 수 있다.

프로젝트에서 많이 사용했던 fetch 함수를 생각해보자. 보통 REST API를 이용할 경우 baseUrl은 몇 개로 고정되고, path나 id값은 아주 많다.

이럴 경우 공통적인 baseUrl은 먼저 기억시켜두고, 특정 값(path, id)만 서버 요청을 수행하는 함수를 만들면 개발 효율성이나 가독성 측면에서 유리하다.

var getInformation = function (baseUrl) {     // 서버에 요청할 주소의 기본 URL
  return function (path) {     // path 값
    return function (id) {     // id 값 
      return fetch(baseUrl + path + '/' + id);     // 실제 서버에 정보를 요청
    };
  };
};


// ES6
var getInformation = baseUrl => path => id => fetch(baseUrl + path + '/' + id);

※ 참고 자료
코어 자바스크립트

profile
Hello

0개의 댓글