Day37 <useEffect>

useEffect

component가 렌더링 될 때마다 side effect을 실행할 수 있도록 (제어하는) 하는 Hook 이다.

Component가 mount 됐을 때, unmount 됐을 때, update 됐을 때 특정 작업을 처리할 수 있다.

react는 페이지를 rendering 해주는데 이 작업을 제외한 모든 것을 사이드 이펙트라고 표현한다.

렌더링은 함수를 실행해서 return 값을 가져오는데 이때 무한루프에 빠질 수 있다. 그런 특정 상황에서 useEffect를 사용한다.

useEffect 함수는 인자로 callback 함수와 dependencies 배열을 받는다

useEffect(function, dependencies)

* function에는 실행하고자 하는 함수가 들어가고, dependencies에는 배열 형태의 function을 실행 시킬 조건이 들어간다.

* 변경되는 state, props, 함수 등이 dependices 인자로 들어가게된다 (componentDidMount).
* 반대로 dependencies에 넣지 않아도 되는 것에는 로직이 변경 되지 않는 setState,내장 api 함수인 setTimeOut, setinterval, localstorage 등이 있다.
* useEffet 내부에서 return으로 선언해주면 component가 사라질 때 return을 보여주며 사라진다.(ComponentWillUpdate).