هناك نوعان من الظروف: التحميل والتحديث، لذا فإن useMemo له تطبيقان: mountMemo و updateMemo.

• الكود المصدري لـ mountMemo:

function mountMemo(
  nextCreate: () => T,
  deps: Array | void | null,
): T {
  const hook = mountWorkInProgressHook();
  const nextDeps = deps === undefined ? null : deps;
  const nextValue = nextCreate();
  if (shouldDoubleInvokeUserFnsInHooksDEV) {
    setIsStrictModeForDevtools(true);
    nextCreate();
    setIsStrictModeForDevtools(false);
  }
  hook.memoizedState = [nextValue, nextDeps];
  return nextValue;
}

توضيح:
في مرحلة التحميل، تستدعي الدالة useMemo دالة رد الاتصال لحساب القيمة وإرجاعها. احفظ القيمة وتوجه إلى ملف Hook.memoizedState.

1. استخدم mountWorkInProgressHook لإنشاء كائن ربط.

2. احفظ deps في nextDeps.

3. اتصل بـ nextCreate () للحصول على nextValue. إذا كنت في بيئة تطوير، اتصل مرتين.

4. احفظ القيمة التالية وnextDeps في الخطاف.memoizedStateوإرجاع القيمة التالية.

• الكود المصدري لـ updateMemo:

function updateMemo(
  nextCreate: () => T,
  deps: Array | void | null,
): T {
  const hook = updateWorkInProgressHook();
  const nextDeps = deps === undefined ? null : deps;
  const prevState = hook.memoizedState;
  // Assume these are defined. If they're not, areHookInputsEqual will warn.
  if (nextDeps !== null) {
    const prevDeps: Array | null = prevState[1];
    if (areHookInputsEqual(nextDeps, prevDeps)) {
      return prevState[0];
    }
  }
  const nextValue = nextCreate();
  if (shouldDoubleInvokeUserFnsInHooksDEV) {
    setIsStrictModeForDevtools(true);
    nextCreate();
    setIsStrictModeForDevtools(false);
  }
  hook.memoizedState = [nextValue, nextDeps];
  return nextValue;
}

توضيح:
في مرحلة التحديث، ستحكم React على ما إذا كانت عمليات الحذف قد تغيرت أم لا، وإذا تغيرت، ستقوم React بتشغيل رد الاتصال للحصول على القيمة الجديدة والعودة. إذا لم يتم تغييرها، فسوف تُرجع React القيمة القديمة.

1. الحصول على كائن ربط جديد: Hook = updateWorkInProgressHook();
2. إذا كانت صفيف deps فارغًا إذا (nextDeps !== null)، فاستدعاء وظيفة رد الاتصال في كل عرض وإرجاع قيمة جديدة.
3. إذا لم تكن مصفوفة deps فارغة، فاحكم على ما إذا كانت deps قد تغيرت أم لا إذا (areHookInputsEqual(nextDeps, prevDeps)). إذا لم يتم تغييرها، قم بإرجاع القيمة القديمة return prevState[0].