React Frontend Developer

Question 1

Объясните разницу между последовательным и параллельным выполнением асинхронных функций. Как работают Promise.all() и Promise.allSettled()?

Accepted Answer

Последовательное выполнение асинхронных функций означает, что каждая следующая функция начинается только после завершения предыдущей, тогда как параллельное выполнение позволяет нескольким функциям выполняться одновременно.

Метод Promise.all() запускает несколько промисов параллельно и возвращает результат, когда все они успешно завершатся, а Promise.allSettled() возвращает результат независимо от того, завершился ли каждый промис успехом или ошибкой.

Question 2

Есть два параллельных запроса: один возвращает A, другой B. Как получить их результаты и объединить A и B, если нельзя использовать Promise.all?

Accepted Answer

Для объединения результатов двух параллельных запросов без Promise.all можно использовать: счетчик завершения, async/await с отдельными await, Promise.race для контроля времени, или ручное создание промисов с отслеживанием состояния. Также подходят библиотеки как RxJS или кастомная реализация механизма ожидания.

Question 3

Как реализовать аналог Promise.all вручную?

Accepted Answer

Аналог Promise.all можно реализовать, создав новый Promise и вручную отслеживая выполнение всех переданных Promise. Нужно сохранить результаты в массив в правильном порядке и считать количество завершённых операций. Если хотя бы один Promise отклоняется, итоговый Promise должен сразу перейти в состояние rejected. Это демонстрирует понимание базовой модели Promise.

Question 4

В чем особенность Promise.all при ошибке одного из промисов?

Accepted Answer

Promise.all ожидает выполнения всех переданных промисов. Если хотя бы один промис завершится с ошибкой (rejected), то весь Promise.all немедленно завершается с этой ошибкой, игнорируя результаты остальных промисов (даже если они успешно завершились). Это поведение называется "быстрым отказом" (fail-fast). Для обработки ошибок без прерывания всего процесса можно использовать Promise.allSettled.

Question 5

Какие есть альтернативы Promise.all?

Accepted Answer

Основные альтернативы Promise.all — это Promise.allSettled, Promise.race и Promise.any. Promise.allSettled ждёт завершения всех промисов, независимо от их статуса (успех или ошибка), и возвращает массив результатов с информацией о каждом. Promise.race возвращает результат первого завершившегося промиса (успешного или с ошибкой). Promise.any возвращает результат первого успешно выполнившегося промиса, а если все завершатся с ошибкой, то возвращает AggregateError. Эти методы дают более гибкий контроль над асинхронными операциями.

Question 6

Как корректно обернуть не-промисные значения в кастомной реализации Promise.all?

Accepted Answer

Для корректной обработки не-промисных значений в кастомной реализации Promise.all необходимо обернуть каждое значение в Promise.resolve(). Это гарантирует, что все элементы массива будут промисами, даже если изначально они являются обычными значениями. Затем можно использовать Promise.all или реализовать собственную логику ожидания всех промисов.

Question 7

Как обеспечить сохранение порядка результатов в кастомной реализации Promise.all при асинхронном выполнении промисов?

Accepted Answer

Для сохранения порядка результатов в кастомной реализации Promise.all нужно создать массив результатов фиксированной длины и присваивать каждому результату индекс, соответствующий исходному порядку промисов. При разрешении каждого промиса результат записывается в ту же позицию, что и исходный промис. После завершения всех промисов возвращается массив с сохранённым порядком.

Question 8

Как совместить Promise.all и Promise.race для реализации логики: «выполнить все запросы, но прервать, если они занимают дольше заданного времени»?

Accepted Answer

Можно создать массив промисов и передать его в Promise.all, а затем обернуть результат в Promise.race с промисом таймаута. Если таймаут срабатывает раньше, Promise.race завершается с ошибкой, что прерывает выполнение. Это позволяет ограничить общее время выполнения группы запросов.

Вопросы React Frontend Developer