React Frontend Developer

Question 1

Для чего нужны callback и что такое Callback Hell?

Accepted Answer

Колбэк (callback) — это функция, которая передается другой функции в качестве аргумента и вызывается позже, когда произойдет какое-то событие или завершится операция. Проблема "Callback Hell" возникает, когда функции начинают вкладываться друг в друга слишком глубоко, что делает код трудночитаемым и сложным для поддержки.

Question 2

Отличие useMemo от useCallback.

Accepted Answer

useMemo и useCallback оба предназначены для оптимизации производительности в React, но служат разным целям. useMemo запоминает вычисленные значения, а useCallback запоминает функции. Это позволяет избежать лишних вычислений и создания функций при каждом рендере компонента.

Question 3

Для чего нужны useMemo и useCallback? Как работает мемоизация?

Accepted Answer

useMemo: Кэширует результат вычислений, пересчитывая только при изменении зависимостей.useCallback: Кэширует функцию, предотвращая её пересоздание.Оба помогают избежать лишних ререндеров.

Question 4

Гарантирует ли setTimeout выполнение callback ровно через заданное время?

Accepted Answer

setTimeout не гарантирует выполнение callback ровно через указанное время. Он гарантирует, что callback не выполнится раньше, чем пройдёт заданная задержка. После истечения задержки callback попадает в очередь задач и будет выполнен, когда освободится call stack. На фактическое время влияет нагрузка, блокировки и приоритеты очередей. Поэтому таймер часто срабатывает позже.

Question 5

В чем разница между useMemo и useCallback?

Accepted Answer

useMemo мемоизирует вычисляемое значение.useCallback мемоизирует функцию.Оба хука зависят от массива зависимостей.Они используются для оптимизации перерендеров.

Question 6

Какие есть издержки у чрезмерного использования useMemo и useCallback?

Accepted Answer

useMemo и useCallback сами по себе имеют стоимость. Они усложняют код и увеличивают когнитивную нагрузку. При неправильном использовании они не дают выигрыша в производительности. Иногда они даже замедляют приложение. Эти хуки нужно применять осознанно и точечно.

Question 7

Чем отличается передача значения и callback в setState?

Accepted Answer

Передача значения в setState напрямую подставляет новое состояние, а callback (функция-обновитель) вычисляет его на основе предыдущего. Callback гарантирует корректность при нескольких обновлениях подряд. Это особенно важно при асинхронных событиях и батчинге обновлений. В React hooks callback — это предпочтительный способ при зависимостях от старого состояния.

Question 8

Почему this внутри callback функции filter может быть undefined?

Accepted Answer

this внутри callback-функции filter может быть undefined, потому что callback вызывается как обычная функция, а не как метод объекта. В строгом режиме ("use strict") значение this в таких функциях равно undefined. Контекст не “передаётся автоматически” внутрь callback. Поэтому this там часто оказывается не тем, что ожидают.

Question 9

Как передать корректный контекст в callback массива?

Accepted Answer

Корректный контекст в callback можно передать несколькими способами: использовать стрелочную функцию, явно привязать this через bind или передать второй аргумент в методы массива. Самый популярный и безопасный способ — стрелочные функции, так как они не имеют собственного this. Выбор подхода зависит от стиля кода и окружения.

Question 10

В чём разница между мемоизацией значений и мемоизацией функций?

Accepted Answer

Мемоизация значений (useMemo) сохраняет результат вычисления, чтобы не пересчитывать его без нужды. Мемоизация функций (useCallback) сохраняет ссылку на функцию, чтобы она не создавалась заново. В React это важно из-за shallow сравнения props и зависимостей. Оба инструмента полезны, когда вычисления дорогие или когда ссылка влияет на ререндер дочерних компонентов.

Вопросы React Frontend Developer