Вопросы React Frontend Developer

Если два маршрута совпадают, <Routes> выбирает первый, который полностью соответствует текущему URL. Это называется "точное совпадение". Чтобы управлять этим, маршруты размещаются в порядке убывания специфичности (от более специфичных к менее специфичным).

<Route> определяет отдельный маршрут и связан с конкретным компонентом, который отображается при совпадении URL. <Routes> является контейнером для <Route> и отвечает за поиск первого подходящего маршрута. Без <Routes> компоненты <Route> не будут работать корректно в новых версиях React Router.

React Router DOM предоставляет ключевые компоненты, такие как <BrowserRouter>, <Routes>, <Route>, и <Link>. <BrowserRouter> используется для обертки приложения, чтобы включить маршрутизацию. <Routes> содержит набор маршрутов, а <Route> определяет, какой компонент рендерится при совпадении с определенным URL. <Link> используется для создания ссылок, которые позволяют навигацию без перезагрузки страницы.

Доступ к объекту истории в React Router можно получить через useHistory() или useNavigate() в функциональных компонентах, что позволяет манипулировать текущим маршрутом.

BrowserRouter и HashRouter — это методы маршрутизации в React Router. BrowserRouter использует истинные URL, в то время как HashRouter использует хэш-фрагменты (#).

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

useEffect выполняется асинхронно после рендеринга, что позволяет обновлять DOM без блокировки отображения. useLayoutEffect, напротив, выполняется синхронно сразу после изменения DOM и перед его отображением, что позволяет производить измерения или манипуляции с элементами. Это может быть полезно, когда необходимо сразу же реагировать на изменения и избежать мерцания интерфейса.

Свойство border создаёт рамку вокруг элемента и занимает пространство в модели документа, тогда как outline также создаёт рамку, но не занимает места и не влияет на размеры элемента. Кроме того, outline может быть использован только с определёнными свойствами, такими как outline-color, outline-style и outline-width.

Событие mouseleave срабатывает, когда курсор мыши уходит за пределы элемента, включая все его дочерние элементы. Событие mouseout, в свою очередь, срабатывает, когда курсор покидает элемент или его дочерний элемент. Таким образом, mouseout может сработать несколько раз внутри одного элемента при переходе между дочерними элементами.

setTimeout выполняет указанную функцию один раз через заданное время, а setInterval — периодически, с указанным интервалом. Оба метода работают асинхронно, что значит, что они не блокируют основной поток выполнения программы. Чтобы остановить выполнение setInterval, нужно вызвать clearInterval, а для остановки отложенного вызова setTimeout — clearTimeout.