[JavaScript][clean-code] 순수 함수(pure function)

* 순수 함수(pure function)

- 부작용(side effect)을 일으키지 않는 함수 

---

* 부작용 (side effect) list

• Logging a value to the console
• Saving a file
• Setting an async timer
• Making an AJAX HTTP request
• Modifying some state that exists outside of a function, or mutating arguments to a function
• Generating random numbers or unique random IDs (such as Math.random() or Date.now())

* 순수 함수가 아닌 예시 (BAD)

let num1 = 10;
let num2 = 20;

function impureSum1() {
  return num1 + num2;
}

• 호출할 때 마다 일관적인 값을 반환해야하는데 누군가 num1, num2의 값을 조작하면 다른값이 반환된다.
• 외부에서 조작이 가능하다.
• 즉, 비순수한 함수이다.

function impureSum2(newNum) {
  return num1 + newNum;
}

impureSum2(30); // 40

num1 = 100;

impureSum2(30); // 130

• 인자는 받고 있지만 누군가 num1의 값을 제어할 경우 일관적인 값을 반환하지 않는다.
• 동일한 호출이여도 다른값이 나올 수 있다.
• 따라서 side effect가 발생한다. (해당 예시는 함수를 사용할 때 예측이 되지 않는 코드이다.)

* 순수 함수 예시 (GOOD)

function  pureSum(num1, num2) {
  return num1 + num2;
}

pureSum(10, 20);
pureSum(10, 20);
pureSum(10, 20);
pureSum(10, 20);

• 호출할때마다 값이 충분히 예측이 된다.
• input이 동일하면 동일한 output이 출력된다.

* 조금 헷갈리는 문제(value, reference)

function changeValue(num) {
  num++;

  return num;
}

changeValue(1); // 2

 

- Copy by reference (객체, 배열)

const obj = { one: 1 };

function changeObj(targetObj) {
  targetObj.one = 100;

  return { ...targetObj, one : 100 };
}

changeObj(obj); // { one: 100 }

obj; // { one: 100 }

• 객체는 참조값을 가르키고 있기 때문에 값을 변경하거나 복사할 때 항상 유의해야한다.

 

[결론적으로]

항상 순수함수를 만든다는 생각을 가지면서 함수를 작성해야한다. 

항상 동일한 input에 동일한 output을 내보내는 함수인지 확인

 

객체를 다룰때는 항상 새롭게 만들어서 반환할것