[React] useEffect란?

useEffect란 무엇일까?

• useEffect는 기본적으로 몇 가지 조건에 의해 작동하게 된다.

1. 페이지가 처음 렌더링 되고 난 후에 useEffect는 무조건 한번 실행된다.

2. useEffect에 배열로 지정한 useState의 값이 변경되면 실행하게 된다.

*useEffects는 렌더링, 변수의 값 혹은 오브젝트가 달라지게 되면 그것을 인지하고 업데이트를 도와주는 함수이다. useEffect는 콜백 함수를 호출하게 되며, 렌더링 혹은 값, 오브젝트의 변경에 따라 여러 개의 함수들을 동작시킬 수 있다.

useEffect를 사용하는 방법

1. useEffect의 가장 기본적인 형태이지만 주로 사용되지는 않는다.

useEffect(() => {});

2. useEffect를 렌더링 한 후에 한 번만 실행하고 싶을 때 사용 할 수 있다.

useEffect(() => {}, [])'

3. useEffect를 렌더링 후 한 번, 그리고 배열 안 변수의 값이 변할 때마다 실행하는 방법이다. 지정된 변수의 값이 변했을 때만 실행하게 된다.

const [name, setName] = useState();
useEffect(() => {}, [name])

정리

• useEffect는 어떠한 값의 변화가 일어나면 실행되어 특정 함수나 작업을 실행하는 함수이다.
  useEffect는 콜백 함수를 가지며, Dependecny는 있을 수도 있지만 없을 수도 있다.

• useEffect는 무조건 렌더링 후에 한 번 실행된다.

• useEffect는 3가지 방법으로 사용된다.

*Dependency가 있던 없던 간에 렌더링 후에 useEffect는 무조건 한 번 실행된다!