useEffect

React Component가 렌더링 될 때마다 특정 작업을 수행하도록 설정 할 수 있도록 하는 Hooks

• 기본적으로 렌더링 되고난 직후마다 실행되며, 두번째 인자 배열에 무엇을 넣느냐에 따라 실행되는 조건이 달라진다.

• useEffect를 실행할 수 있는 조건을 알아보자.

---

마운트 될 때만 실행하고 싶을 때

마운트 = DOM객체가 생성되고 브라우저에 나타날 때

DOM객체가 생성되고 브라우저에 나타날 때만 실행하고 싶을 때는
useEffect()의 두번째 인자에 비어있는 배열을 넣어준다.

useEffect(() => {}, [빈 배열]);

---

특정 값이 변경될 때만 실행하고 싶을 때

useEffect()의 두번 째 배열안에 검사하고 싶은 값을 넣어준다.
관리하고 있는 state 값이나 props로 전달받은 값을 넣어줘도 된다.

---

언마운트되기 전이나 업데이트 되기 직전에 실행하고 싶을 때

useEffect()에서 뒷정리(cleanup)함수를 반환해주어야 한다.

언마운트 = 컴포넌트가 DOM에서 제거되는 것

• 뒷정리 함수는 함수가 호출 될때에는 업데이트 되기 직전의 값을 보여준다.
  언마운트될 때만 뒷정리 함수를 호출하고 싶다면 두번째 인자에 빈 배열을 넣으면 된다.

useEffect(() => {뒷정리함수},[])