[React] React Hooks⑤: useCallback


[React] React Hooks⑤: useCallback

useMemo가 특정 결과값을 캐싱하게 해주는 훅이었다면 useCallback은 특정 함수 자체를 캐싱해서 사용할 수 있게 해주는 훅입니다. 바로 코드 예제를 보면서 사용법을 익혀보도록 하겠습니다. useCallback 사용법 const cachedFn = useCallback(fn, dependencies) useCallback의 첫 번째 인자는 함수입니다. 우리가 캐싱해서 사용하고자 하는 함수를 첫 번째 자리에 넣으면 됩니다. useMemo의 두 번째 인자는 배열입니다. useCallback은 배열 안에 들어온 값이 변할 때만 첫 번째 인자로 들어온 함수를 캐싱합니다. 즉, useCallback은 배열로 들어온 값이 변하지 전까지는 계속 같은 함수를 캐싱하고 있는 것입니다. useCallback 실제 사용 예제 import { useCallback } from 'react'; function ProductPage({ productId, referrer, theme }) { con...


#hooks #react #useCallback #최적화

원문링크 : [React] React Hooks⑤: useCallback