지난 회사에서 XML로 작성된 코드를 React로 변경하는 업무를 진행하면서, 리팩터링 작업에 대한 고민을 굉장히 많이했다.
리팩터링의 가장 중요한 포인트는 ' 결과의 변경 없이 코드의 구조를 재조정 하는 것 ' 인데,
특히나 작업시 가장 고민되었던 포인트는 ' 어떤 기준으로 코드를 재 조정할껀데? ' 였다.
위 책을 통해 그 고민에 대한 답을 찾을 수 있을 것 같아서 스터디를 시작하게 되었다.
WEEK1에서는 액션, 계산, 데이터의 구분에 대한 내용을 다뤘다.
액션, 계산, 데이터
함수형 프로그래밍에서는 코드를 액션, 계산, 데이터로 나눈다.
액션 | 계산 | 데이터 |
실행 시점과 횟수에 의존 = 부수효과, 부수효과가 있는 함수, 순수하지 않은 함수 ex) 이메일 보내기, DB읽기 |
입력으로 출력을 계산, 호출 시점이나 횟수에 의존하지 않고 동일한 입력값으로 부르면 항상 같은 결과 값을 나타냄 = 순수함수, 수학함수 ex) 최댓값 찾기, 이메일 주소 확인 |
이벤트에 대한 사실, 일어난 일의 결과 ( 설명은 어렵지만 우리가 일반적으로 생각하는데이터와 의미가 동일하다) ex) 입력한 이메일 주소, 달러 수량 |
데이터
- 이벤트에 대한 사실, 일어난 일의 결과를 기록한 것
- JS에서는 숫자, 문자, 배열, 객체
- 데이터 구조로 의미 담기 ( 목록의 순서가 중요하다면 순서를 보장하는 데이터 구조 사용, 도메인 표현 가능 )
- 불변 데이터 구조를 만들기 위한 두가지 원칙 : 카피-온-라이트, 방어적복사
- 직렬화된 데이터는 전송하거나, 저장하고 읽기가 쉽다.
- 데이터는 서로 동일성 비교가 쉽다
- 데이터는 여러 가지 방법으로 해석 가능해 자유로운 해석이 가능
계산
- = 순수함수, 수학함수
- 입력값으로 출력값을 만드는 것
- 실행 시점과 횟수에 관계없이 항상 같은 입력값에 대해 같은 출력값을 돌려줍니다.
- 언제 어디서나 원하는 만큼 데스트실행이 가능
- 기계적인 분석이 쉽다.
- 계산 조합을 통해 더 큰 계산을 만든다.
- 동시실행, 과거나 미래에 실행 횟수는 걱정하지 않아도 됨
- 실행하기 전에 어떤 일이 발생할지 알 수 없다는 단점
액션
- = 순수하지 않은 함수(impureF), 부수 효과 함수(side-effectingF), 부수 효과가 있는 함수 (Fwith side effects)
- 외부 세계에 영향을 주거나 받는 것
- 실행 시점과 횟수에 의존
- 함수로 구현
- 내부에 계산과 데이터만 있고 가장 바깥쪽에 액션이 있는 구조가 이상적
- 액션이 호출되는 시점에 의존하는 것을 제한
코딩을 시작하기 전에 문제를 액션, 계산, 데이터로 구분해보고,
코드를 읽을때는 코드가 액션, 계산, 데이터 중 어떤 것에 속하는지 파악하면서 프로그래밍을 해야한다.
실제 코드를 짤때는 데이터를 파악하는 것으로 시작해서, 계산과 추가 데이터를 도출하고, 액션으로 묶어서 코드를 짜야 한다.
함수형 프로그래밍에서는
액션은 가능한 쓰지않고, 계산으로 바꿀수 있다면 바꿔주고,
계산은 더 작은 계산이 된다면 더 쪼개는 작업을 해야한다.
계산은 외부에 영향을 주지 않기 때문에 쉽게 테스트가 가능하다는 장점이 있어 위와 같은 작업을 해야 하지만!
너무 잘게 쪼개면 오히려 코드가 복잡해지고 이해도가 떨어지게 되니,
구현하기 쉽다고 생각되면 계산을 쪼개는 것을 멈춰야 한다.
구현하기 쉽다고 생각되는 기준은 뭘까??? 내가 생각했을땐 내가 아닌 남도 구현하기 쉬울까? 를 생각하면 답이 될 것 같다는 생각이 들었는데 근데 책을 읽다보면 더 명확한 답을 알아낼것 같다.
액션의 다양한 형태
// 함수 호출 (팝업 창이 뜨는 것은 액션)
alert("Hello world");
// 메서드 호출
console.log("hello");
// 생성자 (부르는 시점에 따라 다른 값을 가지기 때문에)
new Date();
// 표현식 - 변수 참조 (y가 공유되고 변경 가능한 변수라면 읽는 시점에 따라 값이 다를 수 있다)
y
// 표현식 - 속성 참조 (user가 공유되고 변경 가능한 객체라면 읽는 시점에 따라 값이 다를 수 있다.)
user.first_name
// 표현식 - 배열 참조 (stack이 공유되고 변경 가능한 배열이라면 첫번째 항목은 읽는 시점에 따라 값이 다를 수 있다.)
stack[0]
// 상태 - 값 할당 (공유하기 위해 값을 할당했고 변경 가능한 변수라면 다른 코드에 영향을 주기 때문에 액션이다.)
z = 3
// 상태 - 속성 삭제 (속성을 지우는 것은 다른 코드에 영향을 주기 때문에 액션이다.)
delete user.first_name;
코드를 잘게 쪼개는 행위는 아직까지 어떤 기준으로 행해져야 하는지 아직은 확실하게 감이 잡히질 않지만, 궁극적으로 이 책을 다 읽고 난다면 좀 더 명확한 기준을 가지고 코드 리팩터링을 하고, 클린코드를 짤 수있는 개발자가 되어있길 바란다.
'FE > BOOK' 카테고리의 다른 글
[함수형코딩]WEEK3 불변성 이야기 (2) | 2025.03.29 |
---|---|
[함수형코딩]WEEK2 함수형 사고: 더 좋은 액션 만들기 (1) | 2025.03.19 |
[HTTP 완벽가이드] 18장 웹 호스팅 (0) | 2025.02.10 |
[HTTP 완벽가이드] 17장 내용 협상과 트랜스 코딩 (2) | 2025.02.10 |
[HTTP 완벽가이드] 16장 국제화 (1) | 2025.02.05 |