FrontendQuiz - задачи с собеседований по фронтенду
1.74K subscribers
244 photos
2 videos
2 files
161 links
Задачки для фронтендщиков:
алгоритмы, регулярные выражения, вопросы с интервью, задачи для Junior Frontend и разбор их решения.

Сотрудничество: @cyberJohnny
Download Telegram
🤔 В чем отличие между foreach и map?

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

Ставь 👍 если знал ответ, 🔥 если нет. Забирай 📚
🤔 Какой JavaScript объект используется для создания и манипуляции виртуальными файловыми системами в браузере, обеспечивая временное хранение файлов и данных?
Anonymous Poll
32%
FileSystem API
10%
VirtualFS
56%
Storage API
5%
WebFS
🤔 Что такое HTTP?

HTTP (Протокол передачи гипертекста) — это метод передачи данных между клиентом (браузером) и сервером. Он функционирует на основе запросов (GET, POST, PUT, DELETE) и ответов, позволяя обмениваться текстами, медиа и другими видами данных.

Ставь 👍 если знал ответ, 🔥 если нет. Забирай 📚
🤔 Какие существуют хуки?

В React хуки — это специальные функции, которые дают возможность "подключаться" к состоянию и жизненному циклу функциональных компонентов. Основные хуки включают useState для управления состоянием, useEffect для обработки побочных эффектов и useContext для доступа к контексту. Также имеются пользовательские хуки, которые можно создавать для повторного использования логики между компонентами. Хуки позволяют использовать функциональные компоненты так же эффективно, как и классовые.

Ставь 👍, если знал ответ, 🔥 если нет. Забирай 📚
🤔 Что представляет собой репозиторий?

Это место, где хранятся код, файлы и их история изменений. Он предназначен для работы в команде над проектами. Репозитории могут быть локальными (на вашем компьютере) или удаленными (например, на GitHub, GitLab). Системы контроля версий, такие как Git, помогают управлять содержимым репозитория.

Ставь 👍, если знал ответ, 🔥 если нет. Забирай 📚
🤔 Как можно добавить анимацию при добавлении или удалении элемента из списка?

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

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Какое CSS свойство позволяет изменить стековый порядок элемента?
Anonymous Poll
66%
z-index
26%
order
3%
layer
9%
stack
🤔 Какой тип CSS-свойства background-clip определяет, что фон будет ограничен контентом элемента?
Anonymous Poll
28%
border-box
7%
padding-box
65%
content-box
2%
margin-box
🤔 Что такое хук?

Хук — это функция в React, которая дает возможность использовать состояние и другие функции React в функциональных компонентах, такие как useState и useEffect.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Каковы отличия строчных и блочных элементов?

1. Строчные элементы (inline):
- Занимают лишь нужную ширину.
- Не переходят на новую строку.
- Примеры: <span>, <a>, <strong>.

2. Блочные элементы (block):
- Занимают всю ширину родительского элемента.
- Начинают новую строку.
- Примеры: <div>, <p>, <h1>.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Как применить селектор?

Селектор в CSS служит для выбора элементов по их тегам, классам, ID или атрибутам. В JavaScript селекторы применяются через document.querySelector() или useRef в React.

Ставь 👍, если знал ответ, 🔥 если нет. Забирай 📚
🤔 Как можно запретить добавление новых свойств в объект?

Существует несколько методов:
- Object.preventExtensions() — не позволяет добавлять новые свойства.
- Object.seal() — запрещает добавление и удаление свойств, но позволяет изменять их значения.
- Object.freeze() — полностью замораживает объект, свойства нельзя изменять, удалять или добавлять.
Эти методы помогают контролировать структуру объекта на разных уровнях.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Что вернёт следующий код: console.log(" " == false);?
Anonymous Poll
48%
true
41%
false
5%
"false"
5%
Ошибка
🤔 Что такое свойства?

Свойства — это информация, которая передается от родительского компонента к дочернему в React. Они используются для настройки и не могут быть изменены в дочернем компоненте.

Ставь 👍 если знал ответ, 🔥 если нет. Забирай 📚
🤔 Какое CSS свойство задаёт порядок расположения flex-элементов внутри контейнера?
Anonymous Poll
56%
flex-direction
11%
flex-wrap
6%
flex-flow
33%
order
🤔 Вопрос: Какой объект в JavaScript представляет окно браузера?
Anonymous Poll
21%
document
78%
window
5%
screen
2%
history
🤔 Какие функции выполняют атрибуты async и defer?

Атрибуты async и defer изменяют способ загрузки внешних скриптов в HTML.
- async: скрипт загружается асинхронно, одновременно с парсингом HTML, и выполняется сразу после загрузки. Порядок выполнения не гарантирован. Подходит для скриптов, которые не зависят от других (например, аналитика).
- defer: скрипт также загружается параллельно, но выполняется только после завершения парсинга всего HTML-документа, и в порядке подключения. Идеален для инициализации, которая зависит от DOM.

Ставь 👍, если знал ответ, 🔥 если нет. Забирай 📚
👍1
🤔 В чем заключается особенность поведения асинхронных callback?

Асинхронные callback-и не выполняются сразу. Они помещаются в очередь событий и начинают выполняться только после завершения текущего стека вызовов. Это значит, что:
- Код, который идет после вызова асинхронного callback-а, продолжается сразу.
- Callback может сработать позже, вне текущего потока.
- При работе с состоянием, рендером и логикой приложения важно учитывать асинхронный контекст.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚