읽게된 이유

회사에서 Vue2 위주로 하게 되다보니 점점 React에서 사용했던 함수형 코딩과는 거리가 먼 코드를 짜기 시작했고, 이 거리감을 좁히기 위해서 이 책을 읽기 시작 하였음

1장 환영합니다.

• 첫장에서는 이 책의 소개를 해주고 있는데, 크게 두가지로 나누어 진다고 말한다.
  • 액션과 계산 및 데이터 구분 방법 및 구분 이유, 일급 추상 사용방법
• 함수형 프로그래밍의 실용적 의의
  -> 함수형 프로그래밍 실제로 쓸수있고 너도 할수있어!!
• 이 책의 기본 규칙
  • 특정 언어 기능에 의존하지 않는다 - 제일 간단한 JS로 구현
  • 실용적이라 바로 쓸 수 있어야합니다.
  • 현재 사용중인 코드와 관계없이 바로 쓸 수 있다.

2장 현실에서의 함수형 사고

• 책에서는 피자 만들기로 비유 하였지만 읽으면서 느꼈던 점
  -> 변경 가능성 및 일급 추상 설명을 피자 만들기로 설명하는 부분을 보며 스펙을 잘 이해하고 어떻게 액션별, 계산별로 나눌 수 있는지 여부가 결국 실력의 차이였구나 라고 느꼈음
• SI이든 서비스업체이든 짬밥의 차이가 여기서 나오는구나.. 싶더라도 이 책을 읽음으로써 그 차이를 구체적으로 앎으로써 그 짬밥 차이를 어느정도 줄일 수 있겠다고 느껴졌음

3장 액션과 계산 데이터의 차이를 알기

• 구분 시 데이터 < 계산 < 액션 순으로 개념의 크기가 다름
  • 액션은 실행 시점과 횟수에 따라서 서로 달라짐
  • 계산은 액션과 반대로 시점이나 횟수에 따라서 결과가 달라지지않음
  • 데이터는 갖고있는 데이터 그자체 (db 스키마, 타입스크립트 interface및 type) 책에서는 "이벤트에 대한 사실" 이라고 적었음
• setState도 액션, event도 액션, db 호출 및 api 호출도 액션 대부분은 액션이지만 "비즈니스 로직"이라고 부르는 것들은 사실 대부분 계산으로 빠질수 있었음
• 최근 중요하다고 여기는 UI와 비즈니스 로직의 분리가 이거구나 싶었음

왜 이렇게 나눠야만 하는가?

액션은 기능 구현 시 반드시 필요하지만 서로 구분되지 않았을 때 버그를 일으키는 큰 부분 중 하나이다.

수정사항은 계속 발생된다. 그렇다면 이 수정사항을 반영할 때 가장 좋은 방법은? "수정사항이 필요한 액션에만 그 수정사항을 반영하고 다른 부분에는 수정사항으로 인한 사이드 이펙트가 생기지 않게 하기" 가 내가 느꼈던 가장 큰 필요한 사항이다.

즉 현재 우리의 코드에는 여러 액션과 계산이 묶여있어 수정사항 반영 시 묶여있는 액션들로 인한 무조건 사이드 이펙트가 발생하고 있기 때문에 이를 구분짓고, 계산과 액션을 구분 짓고, 한 함수에는 하나의 액션만 들어가는 것이 베스트이다.

4장 액션에서 계산 빼내기

• 여러 액션으로 인한 스파게티 코드가 문제면 어떻게 빼내야 할까

  • 액션과 계산, 데이터의 개념을 알고 실제 코드에서 구분할 수 있어야함

• 위에서 말했던 개념으로 실제로 구분하는 시간을 가지어 구분할 수 있게 하였음

• 액션에 대한 오해

  • 함수 안에서 다른 변수에 영향을 끼치는 것 -> 액션
  • 전역 변수를 읽는 것 -> 액션
  • 암묵적 입력(전역변수 및 인자가 아닌 변수) 및 압묵적 출력 (전역변수 수정) -> 액션

• 사실 생각한것 보다 액션 개많음;

• 그냥 불변성 지키고, 리액트에서 하던대로 하면 함수형 코딩 인가? => 차이점을 알고 액션에 대한 구분을 할 수 있어야함

  • new Date(), localStorage, url 및 searchParams도 액션인가?

• 실행 시점과 횟수에 따라서 변하지 않는다 = 멱등성을 갖는다 = 계산

5장 더 좋은 액션 만들기

• 액션은 만악의 근원인가? => 프로그램에서는 반드시 액션이 필요함

• 어떤 함수에서 액션을 빼더라도 액션의 개념을 모른다면? 여전히 그 함수는 액션일 수 있음

• 비즈니스에서 요구하는 스펙과 함수의 설계를 일치 시킨다면 더 좋은 액션이 될 수 있음

• 리팩토링 기법 사용하기

  • 함수명 정확하게 사용하기
  • 함수 인자 구조 분해 할당
  • 계산 분류하여 계층 나누기
  • 암묵적 입력과 출력 없애기

• 설계는 엉켜있는것을 푸는것이고 풀려있는 것은 언제든 다시 합칠 수 있다. => 우리회사 코드 도 이렇게 할 수 있게 하고싶다.

• 함수 하나당 하나의 일(액션)만 하도록 하자.

• 아쉬운 점 카피-온-라이트 패턴을 빼낸다고 add_element_last 함수를 만들었는데, 얕은복사로 [...array, element] 형태로 할수있는데 왜 slice()를 사용한 함수를 사용했는지 좀 이해가 안됐다. 어떤 차이가 있을까?