React Frontend Developer

Question 1

Что такое ARIA (Accessible Rich Internet Applications), и как правильно использовать атрибуты ARIA для улучшения доступности?

Accepted Answer

ARIA (Accessible Rich Internet Applications) — это набор атрибутов, который помогает разработчикам улучшать доступность сложных веб-приложений для людей с ограниченными возможностями. Атрибуты ARIA могут быть добавлены к HTML-элементам, чтобы описать их роли, состояния и свойства для экранных читалок и других вспомогательных технологий. Например, атрибуты ARIA могут помочь определить, что элемент является кнопкой или заголовком, и предоставить информацию о его состоянии (например, "раскрыто" или "закрыто"). Правильное использование ARIA делает контент более понятным и доступным для всех пользователей.

Question 2

Какие преимущества предоставляет оператор spread по сравнению с альтернативными подходами, такими как метод concat() для массивов или Object.assign() для объектов?

Accepted Answer

Оператор spread (...) позволяет легко копировать и объединять массивы и объекты с помощью более лаконичного и читаемого синтаксиса. В отличие от метода concat(), который требует явного указания массива для объединения, и Object.assign(), который может затруднить копирование объектов с вложенными структурами, оператор spread делает эти операции интуитивно понятными и менее подверженными ошибкам. Это упрощает написание кода и повышает его читаемость.

Question 3

Как обрабатывать ошибки в JavaScript?

Accepted Answer

В JavaScript ошибки обрабатываются с помощью блока try...catch. В блоке try размещается код, который может вызвать ошибку, а в блоке catch — инструкции для обработки этой ошибки. Также можно использовать finally, чтобы выполнить код независимо от того, возникла ошибка или нет. Обработку ошибок можно расширить с помощью кастомных ошибок.

Question 4

Что делает useLocation, и какие данные он предоставляет?

Accepted Answer

useLocation — это хук из React Router, который возвращает объект с информацией о текущем URL. Он предоставляет такие данные, как путь (pathname), строка запроса (search) и состояние маршрута (state), если оно передано.

Question 5

Использовал ли didCatch в React?

Accepted Answer

componentDidCatch — это метод класса React для перехвата ошибок в дочерних компонентах. Он используется в Error Boundaries (границах ошибок), чтобы показать запасной UI вместо падения всего приложения.

Question 6

Как обработать ошибку в промисах без catch, используя только then?

Accepted Answer

Второй аргумент then — это аналог catch:promise.then(
  result => console.log(result),
  error => console.error(error) // Обработка ошибки
);

Question 7

Почему async/await вместо Promises?

Accepted Answer

async/await делает асинхронный код:Читаемым (похож на синхронный).Удобным для отладки (стек вызовов не «разрывается»).Лёгким в обработке ошибок (через try/catch).

Question 8

В каком порядке выполняются then, catch и finally у Promise

Accepted Answer

then вызывается при успешном выполнении Promise, catch — при ошибке, а finally — всегда, независимо от результата. finally выполняется после then или catch, но не меняет значение, если сам не выбрасывает ошибку. Все эти колбэки выполняются как микротаски. Порядок строго следует цепочке.

Question 9

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

Accepted Answer

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

Question 10

Сколько catch реально нужно в цепочке Promise

Accepted Answer

Технически достаточно одного catch в конце цепочки. Он перехватит любую ошибку, возникшую выше. Дополнительные catch нужны только тогда, когда ошибку нужно обработать локально и продолжить выполнение цепочки. Лишние catch без необходимости усложняют код и ухудшают читаемость.

Вопросы React Frontend Developer