Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про React: react, memo

Как работает memo при поверхностном сравнении пропсов?

Вопрос проверяет понимание алгоритма сравнения в React.memo.

Короткий ответ

React.memo сравнивает пропсы попарно (prevProps ↔ nextProps) через Object.is. Если все пропсы равны — перерендера нет.

Длинный ответ

Алгоритм React.memo:

  1. Получает предыдущие (prevProps) и новые (nextProps) пропсы.

  2. Сравнивает каждый ключ через Object.is:

    • Для примитивов: по значению.

    • Для объектов: по ссылке.

Пример:

const props1 = { count: 5, data: { id: 1 } };
const props2 = { count: 5, data: { id: 1 } };

// Поверхностное сравнение:
props1.count === props2.count // true
props1.data === props2.data // false (разные ссылки)

Кастомизация сравнения:
Можно передать свою функцию:

React.memo(Component, (prevProps, nextProps) => {
  return prevProps.id === nextProps.id; // Перерендер только если изменился id
});

Вывод:
React.memo по умолчанию делает поверхностное сравнение, что быстро, но не глубже 1 уровня.

Уровень

  • Рейтинг:

    2

  • Сложность:

    7

Навыки

  • React

    React

Ключевые слова

#react

#memo

Подпишись на React Developer в телеграм