React Frontend Developer

Question 1

Можно ли выбросить ошибку внутри then и как она будет обработана

Accepted Answer

Да, внутри then можно выбросить ошибку с помощью throw. Такая ошибка автоматически превращает Promise в rejected. Она будет поймана ближайшим catch ниже по цепочке. По сути, throw внутри then эквивалентен return Promise.reject(error).

Question 2

Как получить тип store в TypeScript (например, через ReturnType)?

Accepted Answer

Тип store можно получить, взяв тип возвращаемого значения функции его создания. Для этого используется ReturnType. Такой подход избавляет от ручного дублирования типов. Он автоматически подстраивается под изменения в реализации. Это повышает надёжность типизации и снижает количество ошибок.

Question 3

Что возвращает async функция, если внутри нее нет return?

Accepted Answer

Async функция всегда возвращает Promise. Если внутри async функции нет оператора return, она неявно возвращает Promise, который разрешится (resolve) со значением undefined. Это аналогично обычной функции, которая без return возвращает undefined, но обёрнутому в Promise. Например, async function foo() {} вернёт Promise, который выполнится как Promise.

Question 4

Как ведет себя return внутри finally?

Accepted Answer

Если в блоке finally есть оператор return, он переопределит результат, возвращаемый из блока try или catch. Это означает, что значение, возвращаемое из try или catch, будет проигнорировано, и функция вернет значение из finally. Такое поведение может быть неочевидным и часто считается антипаттерном, так как скрывает исходный результат выполнения или ошибку.

Question 5

Что произойдёт, если вызвать хук после условного return в теле компонента?

Accepted Answer

Вызов хука после условного return нарушает правила хуков React. React полагается на порядок вызова хуков между рендерами. Если хук вызывается после return, он может быть пропущен при следующем рендере, что приведет к ошибке "Rendered fewer hooks than expected".

Question 6

Нужно ли использовать return после вызова reject внутри Promise и почему?

Accepted Answer

Использовать return после reject не обязательно, но это хорошая практика. Без return код после reject продолжит выполняться, что может привести к неожиданным ошибкам. return предотвращает выполнение последующего кода и делает намерения разработчика явными.

Question 7

Разбери типичные ошибки при работе с Promise.all и массивом fetch-запросов (обработка результата fetch, применение .ok к результату Promise.all, отсутствие return в .map) — как их исправить?

Accepted Answer

Основные ошибки: необработка статуса ответа через response.ok, отсутствие return в .map, попытка применить .ok к результату Promise.all. Исправляется проверкой response.ok внутри каждого fetch, явным return в .map и обработкой ошибок через catch.

Question 8

Что делает ReturnType?

Accepted Answer

ReturnType — это встроенный утилитарный тип в TypeScript, который позволяет получить тип возвращаемого значения функции. Он использует условные типы и ключевое слово infer для извлечения типа из сигнатуры функции. Это полезно для создания типов на основе существующих функций без их повторения.

Question 9

Зачем нужна функция очистки (return) в useEffect? Что произойдёт без неё при использовании setInterval?

Accepted Answer

Функция очистки в useEffect выполняется при размонтировании компонента или перед повторным запуском эффекта. Без неё setInterval продолжит работать после ухода с компонента, вызывая утечку памяти и выполняя колбэки на уже размонтированном компоненте. Это может привести к ошибкам и неконтролируемому поведению.

Вопросы React Frontend Developer