순수함수란?

function add (a, b) {
	return a + b
}

• add 는 순수함수가 맞다.

var c;
function add2 (a, b) {
	c = b;
    return a + b + c
}

• add2 는 순수함수가 아니다
  • 왜냐하면 함수 외부에 있는 변수인 c를 변화시키고 있기 때문이다.
• 순수함수가 아닌 것은?
  • 함수를 호출했을 때 어떤 응답이 올지 딱 한 가지로 예측할 수 '없는' 것
• Math.random은 왜 순수함수가 아닐까?
  • 랜덤값 뭐가 나올지 모르게 때문에, 순수 함수가 아니다.
• 어떤 함수가 fetch API를 이용해 AJAX요청을 한다고 가정해보면, 이 함수는 순수함수가 아니다. 왜 일까
  • 네트워크 상황이나 서버상태에 따라서 응답이 달라지기 때문.

왜 순수함수에 대해서 알아야 하는가?

React의 함수 컴포넌트

• 리액트의 함수 컴포넌트는 보통 props를 입력을 받아서 그것을 그대로 그려준다.
  (리턴값에)

function SingleTweet({writer, body, createdAt}) {
	return <div>
    <div>{writer}</div>
    <div>{createdAt}</div>
    <div>{body}</div>
   </div>
}

• 하지만 보통 React applicaition을 작성할 때에는, AJAX 요청이 발생하거나, LocalStorage 또는 타이머와 같은 React와 상관없는 API를 사용하는 경우가 발생할 수 있다. 이는 React입장에서는 Side Effect이다. 그래서 이것들을 다루기 위한 Hook 인 Effect Hook을 제공한다.