커링(Curring) 기법을 적용한 간단한 JavaScript 함수 만들기

 

커링(Curring)이라는 기법을 들은 적이 있다.

커링이란 하나의 함수가 여러 개의 인수를 받는 대신, 하나의 인수를 받고 나머지 인수를 받는 새로운 함수를 반환하는 기법이다.

처음엔 커링 기법이 적용된 화살표 함수의 코드만 보고 뇌가 잠깐 정지해서 이게 뭘까...? 싶은 마음이 들었다.

계속 보다보면 뭔가 동작법을 알 것도 같으면서 조금 헷갈리는 면이 많았다. 그래서 이참에 좀 더 알아보려고 글을 쓴다.

 

먼저 기본 함수와 비교해보며 알아보자.

 

기본 함수 그리고 커링 기법을 적용한 함수

// 기본
function add(a, b) {
  return a + b;
}

add(10, 5); // 15

// 커링기법 적용
function curriedAdd(a) {
  return function(b) {
    return a + b;
  };
}

// 화살표 함수 버전
const curriedAdd = a => b => a + b;

curriedAdd(10)(5); // 15

 

간단한 듯 하지만 간단하지 않은 커링 기법.

이렇게 단일로 사용할 때는 크게 사용해야 할 필요성을 느끼지 못하겠다.

하지만 함수를 재활용 한다는 가정을 두면?

 

const curriedAdd = a => b => a + b;

const add10 = curriedAdd(10);

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

 

a를 10으로 고정한 함수를 add10에 저장하면..... 함수를 쉽게 재활용할 수 있다!

미리 고정값을 배치해두고 변화 가능성이 있는 변수를 대입하는 방법이라면 환율이나 단위 등을 넣어서 변환할 수도 있겠고, 다국어를 처리하는 과정으로 활용해도 될 것 같다.

 

const multiply = a => b => a * b;
const double = multiply(2);

const numbers = [1, 2, 3, 4];
const doubledNumbers = numbers.map(double); // [2, 4, 6, 8]

또한 이 방식은 고차함수인 map 과의 조합에서도 좋은 활용성을 보인다.

아직은 사칙연산 단계지만 실무에서 반복작업을 잘 활용한다면 굉장히 유용해보인다.

 

그러나 이렇게 간단한 작업에서는 의미가 없는 느낌이 크다.

오히려 복잡한 작업에서 어떻게 적용할지 고민해봐야하는데 설계를 정밀하게 짜야할 것 같다.

 

만약 실무 환경에서 적용한다면?

const checkPermission = userRole => requiredRole => {
  if (userRole !== requiredRole)
    throw new Error("접속 권한이 없습니다.");
    
  return true;
};

const adminPermission = checkPermission("admin");

try {
  adminPermission("admin"); // true
  adminPermission("user"); // 접속 권한이 없습니다.
} catch (error) {
  console.error(error.message);
}

 

사용자(비교 대상)의 권한과 필요한 권한(예시에는 admin)을 비교해서 맞지 않을 경우 권한이 없다는 에러 메세지를 출력한다.

 

adminPermission라는 변수를 만들어 requiredRole로 "admin"을 전달한 후 할당해주고,

API 결과 등에서 adminPermission을 호출, 다양한 권한 값을 인자로 넘겨주면 체크가 가능하다.

 

아직은 코드를 보는 것만으로도 조금 어색하지만 익숙해진다면 작업 환경에서 효율이 더 좋아질 것으로 생각된다.