useEffect

useEffect는 함수형 컴포넌트에서도 라이프사이클과 같은 기능을 사용할 수 있게 해준다.
componentDidMount 와 componentDidUpdate, componentWillUnmount 를 합쳐놓은 것이다.
useEffect 함수는 state 변수를 하나만 관리하는것이 좋다. 즉 여러개의 useEffect 함수를 사용하는것을 추천해주고 있다.

useEffect(() => {
  dispatch({
    type: VIDEO_LIST_REQUEST,
  });
}, []); // 최초 렌더링이 될때만 실행
  
useEffect(() => {
  setCurrentVideoIndex(lastIndex);
}, [lastIndex]); // 배열에 원하는 값을 넣어주면 해당 값이 변할때만 실행된다.

useEffect 의 특징

• useEffect 는 컴포넌트가 렌더링 된 후 동작합니다. 이를 이용하여 라이프 사이클처럼 동작을 제어 할 수 있습니다.(최초에 한 번은 무조건 동작합니다)
• 함수 컴포넌트 내부에서만 동작합니다. 클래스 컴포넌트 내부에서는 이용할 수 없습니다.
• useEffect 는 첫 번째인자로 async function 을 지원하지 않습니다.
• useEffect 는 컴포넌트가 사라지기전에 동작을 제어 할 수 있는데, 이를 이용하여 메모리 누수를 방지 할 수 있습니다.