티스토리 뷰

 

함수에는 입력과 출력이 있습니다.

입력은 함수가 계산을 하기 위한 외부정보입니다. 

출력은 함수 밖으로 나오는 정보나 어떤 동작입니다.

 

입력과 출력은 명시적이거나 암묵적일 수 있습니다.

-명시적 입력 :인자

-암묵적 입력 : 인자 외 다른 입력

ex) 전역변수 읽기

-명시적 출력 : 리턴값

-암묵적 출력 : 리턴값 외 다른 출력

ex) 전역변수 값 변경

 

액션에서 계산을 빼내기 (계산 추출)

1. 계산 코드를 찾아 빼낸다 (리팩토링)

2. 새 함수에 암묵적 입력과 출력을 찾는다.

3. 암묵적 입력은 인자로 암묵적 출력은 리턴값으로 바꾼다.

 

예시문제

// 전역변수 : shopping_cart_total

 

function update_shipping_icons(){

  var buy_buttons = get_buy_buttons_dom()

  for(var i = 0; i < buy_buttons.length; i++) {

    var button = buy_buttons[i];

    var item = button.item;

   if(item.price + shopping_cart_total >=20)      // 이 부분이 다른 팀에서 사용하려는 비즈니스 규칙이다

    button.show_free_shipping_icon();

  else 

    button.hide_free_shipping_icon();

}  

 

위 계산 추출하기 3단계를 진행한다.

 

1. 계산 코드를 찾아 빼내고 새로운 함수를 만든다

function get_free_shipping(item_price){   // 새로운 함수 

return item_price + shopping_cart_total >=20  // 계산 코드

}

 

function update_shipping_icons(){

  var buy_buttons = get_buy_buttons_dom()

  for(var i = 0; i < buy_buttons.length; i++) {

    var button = buy_buttons[i];

    var item = button.item;

   if( get_free_shipping(item_price) )      // 새로운 함수를 입력

    button.show_free_shipping_icon();

  else 

    button.hide_free_shipping_icon();

}  

 

2.새 함수에 암묵적 입력과 출력을 찾는다.

function get_free_shipping(item_price){   // 새로운 함수 

return item_price + shopping_cart_total >=20  // shopping_cart_total 전역변수를 가져와서 읽음 (암묵적 입력) 

}

// 암묵적 출력은 전역변수 값을 업데이트 하는 것

 

3. 암묵적 입력은 인자로 암묵적 출력은 리턴값으로 바꾼다.

function update_shipping_icons(){

  var buy_buttons = get_buy_buttons_dom()

  for(var i = 0; i < buy_buttons.length; i++) {

    var button = buy_buttons[i];

    var item = button.item;

   if(get_free_shipping(shopping_cart_total, item_price ) )      // 전역변수를 새로운 함수의 인자로 넣어준다

    button.show_free_shipping_icon();

  else 

    button.hide_free_shipping_icon();

}  

 

// 암묵적입력(전역변수)를 없애고, 출력은 리턴값으로 바꾼다.

// 암묵적 입력 -> 인자(명시적 입력)

function get_free_shipping( total, item_price ){  // 전역변수를 새로운 함수의 인자로 넣어준다 

return item_price + total  >=20  //   출력은 return값으로 변경

}

 

 get_free_shipping() 함수 체크리스트

  • DOM 업데이트와 비즈니스 규칙이 분리되었는가?
  • 전역변수가 없는가? 의존하지 않는가?
  • 함수가 결괏값을 리턴하는가?

모두 Yes

 

 

 

'개발공부 > 함수형코딩' 카테고리의 다른 글

함수형 코딩 - #Chapter 3  (2) 2023.12.07
함수형 코딩- #Chapter 2  (0) 2023.12.07
함수형 코딩 - #Chapter 1  (0) 2023.12.07