react의 의존성 배열이란?

의존성 배열

 - 의존성 배열이란 useEffect 훅에 입력하는 두 번째 매개변수로서, 의존성 배열의 내용이 변경되었을 경우 부수 효과 함수를 실행

 

1. useEffect(effect)

컴포넌트가 렝더링될 때마다 호출

 

2. useEffect(effect, [])

첫 번째 렌더링 후에만 호출

 

3. useEffect(effect, [userId])

첫 번째 렝더링 후에 호출되며, 이후 userId가 변경될 때마다 호출

 

단, 3번에서 userId 라는 값은 항상 렐더링과 관련된 값이어야 한다. 렌더링과 관련된 값이라는 것은 그 값이 변경되면 컴포넌트가 다시 렌더링되는지를 보고 알수 있음. 어떤 변수의 값이 변경되었는데 컴포넌트가 다시 렌더링되지 않는다면 그 변수는 deps 배열에 넣을 필요가 없다. 결국 렌더링과 관련된 값이라는 것은 컴포넌트 상태값, 속성값등을 말하는 것이며, 전역 변수등은 렌더링과 관련된 값이 아니다.