관리 메뉴

틈틈히 메모중

[#1] 함수형 길들이기 본문

함수형 프로그래밍/함수형 자바스크립트

[#1] 함수형 길들이기

개피곤씨 2023. 8. 29. 00:55
객체 지향(OO)은 가동부를 캡슐화 하여 코드의 이해를 돕고,
함수형프로그래밍(FP)은 가동부를 최소화하여 코드의 이해를 돕는다 
- 마이클 페더스

번외) 리액티브 프로그래밍은 '데이터 흐름(data flow)', '변화에 대한 전달(propagation of change)'에 초점을 둠

함수형 사고방식

- 확장성 => Yes!(추가기능을 만들기위해서 코드리팩토링이 계속 필요한가? No!)
- 모듈화 용이성 => Yes!(파일 하나 고치면 다른 파일도 영향받는지? No!)
- 재사용성 => Yes!(중복이 많은지? No!)
- 테스트성 => Yes!(단위 테스트 하기 쉬운 함수인가? No!)
- 헤아리기 쉬움 => Yes!(체계도 없고 가독성좋지 않은 어려운 코드인가? No!

위와 같이 정해진 답을 가질수 있도록 생각하는 방식이 "함수형 사고방식"

 

함수형 프로그래밍의 정의와 필요성

함수형 프로그래밍 ? 함수사용을 강조하는 소프트웨어 개발 스타일 
(부수효과를 방지하고, 상태 변이를 감소시켜 불변성을 유지하면서, 데이터의 제어흐름과 연산을 추상하는 것)

//일반적인? 자바스크립트 코드예시 1
document.querySelector('body').innerHTML = '<h1>안녕하시와요!</h1>';


//위 예시를 함수형으로 바꾸기 예시 1 
function printMsg(el, tag, msg){
	return document.querySelector(`${el}`).innerHTML = `<${tag}>${msg}</${tag}>`;
}
printMsg('body', 'h1', '안녕하시와요!'); 


//위 예시를 좀더 함수적으로 사고해서 아래와 같이 변경하려면? 
//유틸함수 run , addToDom, h1, echo의 함수를 만들어서 아래와 같이 체이닝 해볼수있음  

let printMsg = run(addToDom('body'), h1, echo);
printMsg('안녕하시와요!')

유틸함수를 체이닝 하는 것과 같이 함수형프로그래밍은 "선언적 프로그래밍" 

선언적의 의미 ? 프로그램의 서술(description)와 평가(evaluation)를 분리하여 프로그램 로직이 무엇인지 표현(expression)함
ㄴ> 함수를 매개변수로 받는 고계함수(higher-order-function), 다형성이 좋은 함수를 가지고 재사용성, 확장성을 높이는 것 

 

불변성, 순수함수 원리

순수함수의 특징 (참조투명성을 가짐 = 예측가능한 방향으로 코드를 짠다)
- 주어진 입력에만 의존하고, 평가도중 or 호출 간 변경될수있는 숨겨진 값이나 외부 상태와 무관하게 동작 
- 전역 객체나 레퍼런스로 전달된 매개변수를 수정하는 등 함수 스코프 밖에서 어떠한 변경도 일으키기 않음 

커링(Currying) ? 함수의 여러 인수를 부분적으로 나누어서 세팅하는 것 

// curry() 함수의 느낌만 살펴보기
const curry = (fn) => {
  const arity = fn.length; // 함수의 인자 개수 저장
  return function curried(...args) {
    if (args.length >= arity) {
      return fn(...args); // 인자 개수가 충분하면 원본 함수 호출
    } else {
      return function (...nextArgs) {
        return curried(...args, ...nextArgs); // 인자 개수 부족 시 다음 인자 기다리는 함수 반환
      };
    }
  };
};

// 두 수를 더하는 함수를 curry()를 사용하여 변환
const add = (a, b) => a + b;
const curriedAdd = curry(add);

// curriedAdd 함수 사용
const add5 = curriedAdd(5); // 첫 번째 인자 5를 받는 함수 생성
const result = add5(3); // 두 번째 인자 3을 받아 덧셈 실행

console.log(result); // 출력: 8

 

불변성은 이전 글 참고:-)

 

함수형 프로그래밍 기법 밎 그것이 설계에 미치는 영향

함수형 프로그래밍을 위한 실제적 방법? 
-> 간단한 함수들로 작업을 분해하기 
-> 흐름 체인으로 데이터를 처리하기 
-> 리액티브 패러다임을 실현하여 이벤트 중심코드의 복잡성을 줄이기 ( run 과 같은 함수 구현 => **composition기법 )
  **composition? 두 함수를 합성하면 첫번째 함수의 결과를 다음 함수에 밀어넣는 새로운 함수를 만들어줌
     run(f, g) 로 작성하면 결과적으로 f(g(x)) 작동함 => run 과 같은 함수를 고계함수(higher-order-function)라고 함
-> 지연평가, 느긋한 평가 (Lazy evaluation)이용해서 함수 체인시 필요한시점에 연산이 평가되도록 하기

 

설계에 미치는 영향 -> 위의 '함수형 사고방식'에서 다루었던 질문에 모두 정해진 답을 할수있는 코드를 만들수있다.