함수형 코딩 70-84

!요약

액션을 계산으로 바꾸기
1. 서브루틴 추출하기 : 동작을 유지하며 코드를 바꾸는 것 (지역변수를 입력으로 받고 지역변수를 리턴한다)

2. 함수 추출하기 :
   쇼핑카트.push() 보다는 쇼핑카트를 명확한 객체로 설정하고 쇼핑카드.addItem()로 작성하여 명확한 의미를 전달한다.
   복사본을 만들어서 값을 변경하고 반환한다.

---

Q: 액션을 계산으로 변경하면서 입력된 값을 직접 사용하지 않고 복사해서 사용하는 이유

A: 함수형 프로그래밍에서는 불변성(Immutability)과 순수 함수(Pure Functions) 개념이 중요합니다. 이를 따르면, 함수는 부수 효과(Side Effects)를 최소화하고 입력에 대한 출력만을 반환해야 합니다. 이를 통해 코드의 예측 가능성과 테스트 용이성이 향상됩니다.

function addItem(cart, name, price) {
  var newCart = cart.slice();
  newCart.push({ name, price });
  return newCart;
} 

장점:
입력 배열을 직접 수정하지 않고 복사본을 생성하여 불변성을 유지합니다.
순수 함수(Pure Function)이므로 동일한 입력에 대해 항상 동일한 출력을 반환합니다.
테스트가 용이하고 예측 가능한 결과를 제공합니다.

단점:
배열을 복사하므로 메모리 사용량과 성능에 약간의 영향을 미칠 수 있습니다.

function addItem(cart, name, price) {
  cart.push({ name, price });
  return cart;
}

장점:
메모리 사용량과 성능 면에서 더 효율적일 수 있습니다.

단점:
입력 배열을 직접 수정하므로 불변성을 깨뜨립니다.
부수 효과(Side Effects)가 있어 동일한 입력에 대해 동일한 출력을 보장하지 않습니다.
테스트가 어렵고 예측 가능성이 낮아집니다.
결론적으로, 함수형 프로그래밍에는 1번 함수가 더 적합하며, 코드의 예측 가능성과 테스트 용이성을 향상시킵니다. 하지만 성능과 메모리 사용량이 중요한 경우에는 2번 함수를 고려해볼 수 있습니다.

---

발췌

메모

연습문제1

function update_tax_dom(){
  set_tax_dom(shopping_cart_total * 0.1);
}

->

function update_tax_dom(cart_total){
  value = calc_tax(cart_total)
  set_tax_dom(value);
}

function calc_tax(value){
 return value * 0.1
}

연습문제2

function updateShippingIcons(shoppingCartTotal){
  var buyButtons = getButBottonDom()
  for (var i = 0; i<buyButtons.lenth; i++){
    
	if (isFreeShippingWhenAddItem(shoppingCartTotal,buyButtons[i].item)){
    	button.showFreeShippingIcon();
    }else{
      	button.hideFreeShippingIcon();
    }

  }
  
}

function isFreeShippingWhenAddItem(shoppingCartTotal, item){
  return item.price + shoppingCartTotal >=20
}