React Currying

React curring을 알아보기 전에 고차함수에 대해 간단히 설명하자면,
고차 함수는 함수를 인자로 전달받거나 리턴값으로 함수를 반환하는 함수를 의미한다.

커링(Currying) 기법은 인자가 여러개인 함수의 일부 인자를 고정시키는 새로운 함수를 만드는 기법을 의미한다. 인자가 n개인 함수를 n개로 분리하여 사용하게끔 만드는 기법이다.

예시를 통해 확인해보자.

curring 예시

function helloFunc(word, name) {
    console.log(`${word}, ${name}`);
}

word와 name이라는 두 개의 인자를 받아서 출력해주는 단순한 형태의 함수이다.

이 함수에 커링을 적용해 보자

function helloFunc(word) {
    return function (name) {
        console.log(`${word}, ${name}`);
    };
}

const printHello = helloFunc("hello"); 
printHello("Tibetan Fox"); // hello, Tibetan Fox
printHello("Tiger");       // hello, Tiger

아까의 함수에 커링을 적용한 결과이다.

n(2)개의 인자를 받던 함수가 n(2)개로 쪼개진 것을 볼 수 있다.

또한 첫 번째로 받던 인자인 word를 hello라는 값으로 고정하고 name만 변경하면서 사용 가능한 것을 확인 할 수 있다.

커링 기법은 일부 인자에 같은 값을 반복적으로 사용할 때 그 반복되는 인자를 고정함으로써 중복을 최소화 하기에 적합한 기법이다.

참고 - https://tibetsandfox.tistory.com/32