Какие вопросы задают на собеседовании в Сбербанк (frontend, middle_plus)?

Question

Маяк · Accepted Answer

1. Расскажите, как устроен event loop в JavaScript (очереди задач, микротаски, макротаски, порядок выполнения).
2. Для чего придумали event loop, какую проблему он решает?
3. Что знаете про однопоточность/многопоточность приложения в JavaScript?
4. Если запустить в коде бесконечный цикл, справится ли event loop с этим или нет? Что произойдёт с интерфейсом?
5. Как нужно писать код, чтобы тяжёлые вычисления / асинхронный код не блокировали интерфейс?
6. Если в теле промиса (функции-экзекьюторе) написать бесконечный цикл while(true), заблокирует ли это основной поток и сколько микротасок получится?
7. Как выполняется запрос к бэкенду через промис (fetch) и почему он не блокирует поток?
8. Что такое async/await и как они связаны с промисами?
9. Что такое замыкание (closure) и как его можно использовать?
10. Когда мы в React передаём колбэк внутри пропсов, это будет замыкание?
11. Как реализовано прототипное наследование в JavaScript (прототипы, __proto__, цепочка прототипов)?
12. Как определяются и используются статические методы класса? Используете ли их в практике?
13. В каких случаях вы использовали статический метод, а не член класса?
14. Чем отличаются структуры данных Set, Map и обычный массив?
15. Что знаете про сборщик мусора (garbage collector) в JavaScript?
16. В каких случаях сборщик мусора начинает работать?
17. Для чего нужно запускать сборщик мусора и если бы вы сами писали такой функционал, когда бы его вызывали? Знаете ли про ограничения по памяти у приложений/вкладок браузера?
18. С какими CSS-препроцессорами работали?
19. С какими CSS-методологиями и подходами сталкивались?
20. Какую проблему решает модульный CSS (CSS Modules), для чего его придумали?
21. Как сделать так, чтобы у селектора в стилях был максимально возможный вес (специфичность)?
22. Что такое Virtual DOM, как он работает (reconciliation, diffing, эвристический алгоритм, key)?
23. В каком коде приходится принудительно указывать проп key?
24. Что такое JSX и можно ли использовать React без JSX?
25. Чем отличается функциональный подход от классового в React-компонентах?
26. В каких случаях стоит и не стоит использовать хук useCallback?
27. Что предпочтёте использовать — Context API или Redux, и почему?
28. Знакомы ли с React Portals и для чего они нужны?
29. Опишите жизненный цикл данных в Redux (Flux): action → dispatch → reducer → обновление состояния → интерфейс.
30. Чем отличается action от reducer в Redux?
31. Что такое чистая функция и что относится к побочным эффектам?
32. Как работает кеширование данных в RTK Query?
33. Как провести инвалидацию кеша в RTK Query (теги, providesTags/invalidatesTags)?
34. Что такое дженерики (generics) в TypeScript?
35. Приведите примеры утилитарных типов (utility types) в TypeScript.
36. Что такое протокол HTTP и из чего состоит HTTP-запрос (метод, путь, body, заголовки)?
37. Сталкивались ли с CORS и какими способами его можно обойти/решить?
38. На чьей стороне реализуется CORS и кто выполняет CORS-защиту (сервер или браузер)? Будет ли CORS работать, если делать запрос из консольной утилиты (curl, wget) или Postman?
39. Как настроить прокси, чтобы при разработке фронтенда обращаться к произвольным бэкенд-стендам и не получать ошибку CORS?
40. Как организовать передачу данных через WebSocket и какие есть альтернативы (polling, long polling, Server-Sent Events)?
41. Что выведет в результате выполнения функция a с пустым массивом (вопрос на event loop и var в цикле с setTimeout)? Запустите и объясните, почему выводится массив из трёх единиц три раза.
42. Как изменить код, чтобы он выводил массив последовательно: сначала с одной единицей, потом с двумя, потом с тремя (а не три раза по три)?
43. Что под капотом делает браузер при использовании let вместо var в цикле (создание нового связывания на каждой итерации)?
44. В чём разница передачи в функцию примитива и объекта/массива (по значению vs по ссылке)?
45. Сделайте code review кода джуна (React-компонент, отображающий список справочников с замоканными данными и положением скролла). Найдите максимальное количество замечаний и предложите, как сделать код лучше.
46. Почему нельзя делать колбэк useEffect асинхронным (async) напрямую и как это правильно сделать?
47. Что произойдёт, если в addEventListener и removeEventListener передавать функцию без выноса в отдельную переменную (разные ссылки, отписка не сработает, утечка памяти)?
48. Как правильно хранить статичный/имитирующий ответ сервера массив данных (testData) в компоненте — стоит ли выносить в state, useMemo или утилиту, и какие проблемы при перерендере?
49. Почему плохая практика использовать inline-стили (как и !important) и когда они всё-таки уместны?
50. Как инициализировать значение numberOfRows/положение скролла, чтобы у пользователя не было мерцания (0 → актуальное значение) и прыжка страницы при рефреше?