【React】useCallbackとは

React 16.8で追加されたフック (hook) 機能の一つuseCallbackについて調べた

ja.reactjs.org

useCallback

const memoizedCallback = useCallback(
  () => {
    doSomething(a, b);
  },
  [a, b],
);

メモ化されたコールバックを返す

インラインのコールバックとそれが依存している値の配列を渡す

useCallback はそのコールバックをメモ化したものを返し、その関数は依存配列の要素のいずれかが変化した場合にのみ変化する

これはメモ化されたコンポーネント（不必要なレンダーを避けるために参照の同一性を見るよう最適化されたコンポーネント）にコールバックを渡す場合に便利

useCallback(fn, deps)は useMemo(() => fn, deps) と等価