React Frontend Developer

Question 1

Как определить порядок вывода console.log в асинхронном коде?

Accepted Answer

Чтобы определить порядок вывода console.log, нужно понимать работу event loop. Сначала всегда выполняется синхронный код из call stack. Затем выполняются все микрозадачи (например, then, catch, finally). Только после этого обрабатываются макрозадачи (setTimeout, setInterval, события). Зная, к какой очереди относится операция, можно точно предсказать порядок логов.

Question 2

Что выведется в console.log при разных вариантах вызова функций с контекстом?

Accepted Answer

Значение this зависит от способа вызова функции. При обычном вызове функции this ссылается на глобальный объект (в нестрогом режиме) или undefined (в строгом). При вызове как метода объекта this указывает на этот объект. Методы call, apply и bind позволяют явно задать контекст. Стрелочные функции не имеют своего this и используют контекст окружающей лексической области.

Question 3

Как избежать лишних вызовов console.log в дочернем компоненте?

Accepted Answer

Лишние вызовы console.log в дочернем компоненте возникают из-за повторного рендеринга. Чтобы их избежать, используйте React.memo для предотвращения ненужных рендеров, если пропсы не изменились. Также можно обернуть функции в useCallback и значения в useMemo, чтобы стабилизировать ссылки. Это особенно полезно при передаче колбэков или объектов в дочерние компоненты.

Вопросы React Frontend Developer