본문 바로가기

카테고리 없음

[JavsScript] 함수형 프로그래밍의 핵심 4: go, pipe, curry를 활용한 함수 합성과 데이터 파이프라인 구축

 

 

이전글:

https://daunje0.tistory.com/175

 

[JavsScript] 함수의 부분 적용과 유연한 합성 3: curry - 인자를 유연하게 다루는 고차 함수 만들기

https://daunje0.tistory.com/174 [JavsScript] 함수의 합성과 데이터 파이프라인 2: pipe - 재사용 가능한 함수 파이프라인 만들기https://daunje0.tistory.com/173 [JavsScript] 함수의 합성과 데이터 파이프 라인 1. go함

daunje0.tistory.com

 

마지막으로 조건만 다르고 중복된 함수들을 공통적으로 뽑아서 리팩토링 하는 방법으로 총정리를 하겠습니다

 const products = [
    {name: '반팔티', price: 15000},
    {name: '긴팔티', price: 20000},
    {name: '핸드폰케이스', price: 15000},
    {name: '후드티', price: 30000},
    {name: '바지', price: 25000}
  ];
  
  const log = console.log
  
  const add = (a, b) => a + b;
  
  const go = (...args) => args.reduce((a, f) => f(a));
  const pipe = (...fs) => (a) => go(a, ...fs);
  const curry = f => 
  (a, ..._) =>_.length ? f(a, ..._) : (..._) => f(a, ..._)
  
  const filter = curry((f, iter) => iter.filter(f));
  const map = curry((f, iter) => iter.map(f));
  const reduce = curry((f, iter) => iter.reduce(f));

  go(
    products,
    filter(p => p.price < 20000),
    map(p => p.price),
    reduce(add),
    log
  ); // 30000
  
  go(
    products,
    filter(p => p.price >= 20000),
    map(p => p.price),
    reduce(add),
    log
  ); // 75000

 

위 처럼 가격이 1. 20000 미만 2. 20000 이상으로 조건만 다르고 
 map(p => p.price),  reduce(add),  log 세 함수의 중복을 리팩토링하려면 pipe 함수를 사용하면 됩니다

 

 

const totalPrice = pipe(
  map(p => p.price),
  reduce(add),
  log
)


   go(
    products,
    filter(p => p.price < 20000),
    totalPrice
  );

  
  go(
    products,
    filter(p => p.price >= 20000),
    totalPrice
  );

 

그리고 고차함수의 특성을 다시 이용하면 더욱 간략하게 함수를 리팩토링할 수 있습니다.

 

const totalPrice = pipe(
  map(p => p.price),
  reduce(add),
  log
)

const baseTotalPrice = (condition) => pipe(
  filter(condition),
  totalPrice
)
   go(
    products,
    baseTotalPrice(p => p.price < 20000),
  );

  
  go(
    products,
    baseTotalPrice(p => p.price >= 20000),
  );


참고 : 함수형 프로그래밍과 JavaScript ES6+ 유인동 님
https://www.inflearn.com/course/functional-es6

 

함수형 프로그래밍과 JavaScript ES6+ 강의 | 유인동 - 인프런

유인동 | ES6+와 함수형 프로그래밍을 배울 수 있는 강의입니다. 이 강좌에서는 ES6+의 이터러블/이터레이터/제너레이터 프로토콜을 상세히 다루고 응용합니다. 이터러블을 기반으로한 함수형 프

www.inflearn.com