Lodash fp 사용하기.

 lodash에는 더욱 함수형 프로그래밍 스타일로 코드를 짤 수 있게, 지원해준다. 간단하게 커링을 지원을 해주고, 반복에 대한 행위를  첫번째 인자로, 데이터를 마지막인자로 스왑해주는 정도이다.

 자 위의 내용이 무엇인지 어떻게 좋은 방식인지 한번 검토해보도록 하자.

 예전 포스팅을 본 사람들이거나 함수형프로그래밍을 공부 해보신분들이라면 커링이 무엇인지 알겠지만, 처음 듣는 분들이라면 생소할 내용이니 예를 들고 진행을 하겠다.

커링(Currying)

const curry = func => (a, ...args) => args.length ? func(a, ...args) : (...args) => func(a, ...args)

const sayBlah = curry((msg, to) => `${msg} ${to}!`)

const sayHello = sayBlah('hello')
sayHello('world')
// ➜ hello world!
sayHello('sejiwork')
// ➜ hello sejiwork!

const goodByeMessage = sayBlah('goodBye', 'sejiwork')
// ➜ goodBye sejiwork!

 위의 코드를 적당히 보면 확인이 가능 하다. 함수 A가 2개의 인자를 기대 하였는데, 그 보다 적다면 함수의 평가를 후로 미루게 되며, 함수의 인자가 가득 차게 되면 평가를 하게 된다.

 위의 코드를 lodash fp를 이용하여 간단하게 작성해보자. cdn으로 예제를 따라하게 된다면 아래의 cdn을 이용하도록하자.

<script src="https://cdn.jsdelivr.net/g/lodash@4(lodash.min.js+lodash.fp.min.js)"></script>

const sayBlah = _.curry((msg, to) => `${msg} ${to}!`)

const sayHello = sayBlah('hello')
sayHello('world')
// ➜ hello world!
sayHello('sejiwork')
// ➜ hello sejiwork!

const goodByeMessage = sayBlah('goodBye', 'sejiwork')
// ➜ goodBye sejiwork!

 위의 코드를 당연하게도 수정할 부분은 크게 없다. curry를 직접 구현 한 것이 아닌 _.curry로 변경 해주기만 하면 된다.

자 커링은 알았고, 무슨 장점이 있길래 이게 왜 함수형 프로그래밍 스타일인데?

세가지 스타일 제곱함수

function squareAllV1(numbers) {
    const squaredNumbers = []
    
    for (let i = 0; i < numbers.length; i++) {
        squaredNumbers[i] = numbers[i] * numbers[i]
    }
    
    return squaredNumbers
}

이제는 어색하기만 해진 예전 코드스타일대로 작성한 제곱해주는 함수이다. 뭐 테스트는 해보지 않았으나 문제는 없겠지..

function squareAllV2(numbers) {
    // lodash/map
    return _.map(numbers, a => a * a)
}

기존 lodash를 이용하여 작성한 코드이다 딱히 어색함은 없을 것이라 본다.

// lodash/fp/map
const squareAllV3 = _.map(a => a * a)

위의 코드는 어떤가? 세가지 코드 모두 제곱을 해주는 함수를 정의 한 것이다.

뭐 단순히 코드만 짧아진 것이라 보일 수 있지만, 조금 더 코드가 명시적에서 암묵적으로 변한 것이라 볼 수 있다. 또한 함수형 프로그래밍 특성상 짧은 함수를 많이 작성한다는 것에서도 코드가 짧은 건 이점이겠지...