docs: 챕터4 액션에서 계산 빼내기

챕터_4/이유희.md

@@ -0,0 +1,130 @@
+
+
+1. 테스트하기 쉽게 만들기
+2. 재사용하기 쉽게 만들기
+3. 액션과 계산, 데이터를 구분하기
+4. 함수에는 입력과 출력이 있다
+1. 테스트와 재사용성은 입출력과 관련이 있다
+2. 액션에서 계산 빼내기
+
+
+
+### 문제점
+
+- `cart * 0.01` 를 테스트하기 위해서 `update_tax()`를 테스트해야 한다
+
+```javascript
+function update_tax(){
+	set_tax(cart * 0.01)
+}
+```
+
+- `update_tax()`에 요구사항이 추가되면 더 복잡해진다
+
+- 개선
+    - 테스트하기 쉽게 만들자
+    - 재사용하기 쉽게 만들자
+
+
+### 함수형 사고로 리팩토링하기
+
+
+#### 액션, 계산, 데이터로 구분하기
+
+- 코드를 액션, 계산, 데이터로 분류해보자
+
+
+#### 함수에는 입력과 출력이 있다
+
+- 입력: 함수가 계산을 하기 위한 외부 정보
+- 출력: 함수 밖으로 나오는 정보나 어떤 동작
+- 함수 호출의 목적: 어떤 결과가 필요해서
+
+```javascript
+
+var total = 0;
+// 입력
+function add_to_total(amount){
+	// 전역변수 읽기는 입력이다
+	// 콘솔에 뭔가 찍는 것은 출력이다
+	console.log("toatl :" + total);
+	// 전역변수를 바꾸는 것은 출력이다
+	total += amount;
+	// 리턴값은 출력이다
+	return total;
+}
+```
+
+- 입력
+    - 암묵적 입력
+        - 인자 외 다른 입력
+        - ex) 전역변수를 읽는 것
+    - 명시적 입력
+        - 인자
+- 출력
+    - 암묵적 출력
+        - 리턴값 외 다른 출력
+        - ex) 콘솔에 찍는 것, 전역변수를 바꾸는 것
+    - 명시적 출력
+        - 리턴값
+
+- ***함수에 암묵적 입력과 출력이 있으면 액션이 된다***  *
+    - 암묵적 입력과 출력은 명시적으로 바꾸자
+
+
+
+#### 테스트와 재사용성은 입출력과 관련 있다
+
+- 전역변수가 없어야 하며 의존하지 않아야 한다
+- 함수가 결괏값을 리턴해야 한다
+
+> update 함수를 void로 선언하면 테스트하기 어려웠다. void에서 리턴 타입이 있게 변경하면 테스트하기 쉬워진다.<br>
+> 근데 리턴 타입을 도메인 자체로 하면 객체가 오래 떠돌아 다닐 위험성이 있어 사이드 이펙트가 발생할듯?<br>
+> 업데이트한 속성의 결과 값을 원시형으로 리턴하거나 래퍼 또는 vo를 생성해서 리턴하는게 나을까?<br>
+
+
+> 생각해보기
+> 동작을 유지하면서 코드를 바꾸는 것은 어떤 장점이 있을까?<br>
+> 동작을 유지하면서 코드를 바꾸면 코드 변경의 사이드 이펙트 없이 수정하는 것이라 위험 부담이 줄어든다.<br>
+> 리팩토링한 코드가 기존 동작대로 동작하는게 검증되면 구조를 바꾸거나 패턴으로 추상화 하면서 점진적 개선이 가능하지 않을까나
+
+
+
+#### 액션에서 계산 빼내기
+
+- 액션에서 계산에 해당하는 코드를 분리한다
+- 입력값은 인자로 출력값은 리턴값으로 바꾼다
+
+```javascript
+// 암묵적 출력 명시적으로 변경하기
+
+// 개선 전
+function calc_cart_total(){
+	// calc_total() 내부에서 전역변수를 갱신하는 코드는 암묵적 출력이다
+	calc_total();
+}
+// 개선 후
+function calc_cart_total(){
+	// calc_total()의 리턴값은 이제 명시적 출력이다
+	shopping_cart_total = calc_total();
+}
+```
+
+
+
+```javascript
+// 암묵적 입력 명시적으로 변경하기
+
+// 개선 전
+function calc_cart_total(){
+	// calc_total() 내부에서 전역변수나 객체 프로퍼티를 읽는 코드는 암묵적 입력
+	calc_total();
+}
+// 개선 후
+function calc_cart_total(){
+	// calc_total(shopping_cart) 인자로 입력하면 명시적 입력이다
+	shopping_cart_total = calc_total(shopping_cart);
+}
+```
+
+>