seciton5 6-4. useEffect로 업데이트 감지하기

useEffect : 2번째 파람이 빈 배열 == componentDidMout와 동일

배열에 요소가 있다면 ? componentDidMout, componentDidUpdate 둘 다 수행

 

timerRef (강의 내용에서의 timeouts.current) 가 바뀌는 시점을 헷갈렸다.

왜 강의에서 timeouts.current를 useEffect의 2번째 파라미터로 넣었는지 헷갈렸는데... 다시 생각해보니 내가 헷갈렸던 것...

 

timerRef.current는 배열이기 때문에 push, shift 또는 배열 인덱스로 직접 접근하는 것은 배열 참조(배열의 주소)가 바뀌는 것이 아니기 때문에 바뀌는 것으로 간주하지 않는다.

React에서 배열이나 객체로 된 state나 ref, prorps가 바뀌는 것은 배열의 참조가 바뀔 때 이므로

timerRef.current = []

이렇게나

 tirmerRef.current = [...prev, 0];

이렇게 spread 연산자를 사용하여 새로운 참조를 만들어 줄 때 바뀌는 것이다.

 

 tirmerRef.current[7] = 100; //이건 변경된것으로 간주하지 못한다. 그냥 같은 배열주소에 하나 더 추가된것일뿐
 //변경된 것으로 간주되려면 배열참조가 바뀌어야함!