면접대비

[면접대비] useRef, useEffect

note-for-development 2024. 3. 29. 09:48
  1. useRef에 대해 설명해주세요.
    • keyword: react hook 저장공간, DOM 참조
    • useRef는 값을  DOM을 참조하여 저장할 수 있습니다. console.log에는 확인이 되지만 바로 반영이 되지는 않고 새로고침을 하면 반영이 됩니다. 메모리에 값을 일시적으로 저장되어 불필요한 리랜더링을 하지 않는 장점이 있으며, 따라서 유저가 볼 수 없는 정보를 다루는데 사용됩니다.
  2. useEffect의 실행 순서에 대해 설명해주세요.
    • keyword: useEffect 훅에 대한 정의 useEffect 실행되는 시점 훅에 대한 프로세스
    • useEffect는 외부 시스템과 동기화하여 데이터를 최신상태로 유지시켜주기 위해 사용하는 리엑트 훅입니다. dependancy array가 없으면 모든 DOM 요소가 추가될 때마다 실행됩니다. dependency array가 있다면 해당 값의 DOM 요소가 변화될 때 실행됩니다. 빈 배열이 있다면 랜더링이 시작할 때 한번만 실행됩니다. return 이후로 표시되는 클린업 함수가 포함되어 있다면 DOM에서 해당 dependency array가 사라질 때 실행됩니다.