currying

currying?

Currying은 함수가 여러 개의 파라미터를 받아 동작하는 경우, 파라미터의 일부를 지정해 두고 부족한 파라미터를 추후에 지정하여 사용하는 방식이다.
이를 통해서, 하나의 함수에서 특정 파라미터 값을 통해서 여러개의 파생함수를 만들어낼 수 있다.

ES6 이전의 구현 방법

es6 이전에는 함수를 반환해주는 형태, 클로저 방식으로 커링 함수를 구성 할 수 있었다.

let sum = function (x) {
  return function (y) {
    return x + y
  }
}

let sum_one = sum(1)

console.log(sum_one(7)) // 8

ES6 이후의 구현 방법

es6에서는 Arrow funciton을 통하여 훨씬 간결하고 가독성 좋은 방식으로 구현이 가능해졌다.

let sum = (x) => (y) => x + y

let sum_one = sum(1)

console.log(sum_one(7)) // 8

활용

const updateCard = (card) => async () => {
  const text = document.querySelector(".modal-textarea")?.value
  const params = {
    text: text,
  }
  const res = await Axios.put(`/api/card/${card.id}`, params)
}

const updateCardById = updateCard(card)
modalRender(updateCardById)

updateCard는 card 정보를 통해 서버로 put 요청을 보내는 함수 이다.
updateCard 함수에 card 파라미터를 전달하여, updateCardById라는 새로운 함수를 만들어냈고, 이를 modalRender에 전달하여 모달 버튼의 동작을 변화시켰다.