리액트 훅 | useCallback에 대해 알아보기
·
FRONTEND/React
리액트에서 함수를 사용할 때 그냥 쓰면 안 되고, useCallback으로 감싸야한다는 이야기를 한 번쯤 들어보셨을 겁니다.그런데 왜 그래야 하는지, 의존성 배열은 어떻게 설정해야 하는지 감이 잘 오지 않는 경우가 많습니다.이번 글에서는 간단한 예제를 통해 useCallback의 유무와 의존성 배열 차이가 렌더링에 어떤 영향을 주는지 살펴보겠습니다. 0. 함수 참조란useCallback에 대해 알아보기 전에 "함수 참조"에 대해 알아보겠습니다.자바스크립트에서는 함수는 객체로, 동일한 코드라도 매번 새로 만들게 되면 참조(=주소)가 달라집니다.const fn1 = () => {}; // 참조 Aconst fn2 = () => {}; // 참조 B (fn1과 다름)리액트는 props 변경 여부를 얕은 비교(..