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

Сотрудничество: @cyberJohnny
Download Telegram
🤔
Какое свойство CSS задаёт пространственное поведение скроллируемых элементов, позволяя создать "прилипающий" или "плавающий" эффект при прокрутке?
Anonymous Poll
9%
overflow-behavior
12%
scroll-behavior
76%
position: sticky
3%
float-scroll
🤔 Какие существуют способы реализации двустороннего связывания для input?

Двустороннее связывание можно осуществить:
- В React: с помощью useState и onChange.
- В Vue 2: используя v-model, что упрощает работу с input.
- В Vue 3: также с v-model, но с возможностью именованных привязок.
- В Angular: через [(ngModel)].
- В чистом JavaScript: с использованием addEventListener и value.
Это нужно для синхронизации пользовательского ввода с состоянием.

Ставь 👍 если знал ответ, 🔥 если нет.
🤔 Какое свойство CSS задает минимальный размер содержимого элемента?
Anonymous Poll
42%
min-size
38%
min-content
9%
content-size
11%
min-length
🤔 Какой HTML атрибут устанавливает контроль над способностью элемента к получению фокуса?
Anonymous Poll
44%
focusable
49%
tabindex
13%
focus-index
0%
accesskey
🤔 Что представляет собой Composition API в Vue 3?

Это новый метод управления состоянием и логикой в Vue 3. Он применяет функцию setup() вместо data, methods и computed. Это позволяет более эффективно структурировать код, повторно использовать логику (с помощью composables) и облегчает работу с TypeScript.

Ставь 👍 если знал ответ, 🔥 если нет.
🤔 Какое свойство CSS задает границу вокруг элементов без изменения размера бокса?
Anonymous Poll
40%
border
62%
outline
2%
edge
2%
frame
🤔 Какие есть методы, которые изменяют массив?

Методы, которые изменяют массив:
- push(), pop() – добавляют или удаляют элементы в конце.
- shift(), unshift() – добавляют или удаляют элементы в начале.
- splice() – удаляет, добавляет или заменяет элементы.
- sort() – сортирует массив на месте.
- reverse() – меняет порядок элементов.
- fill() – заполняет массив одинаковыми значениями.
Методы, которые не изменяют массив (map(), filter(), slice(), concat(), reduce()), возвращают новый массив.

Ставь 👍, если знал ответ, 🔥 если нет.
🤔 Что такое event loop?

Event loop — это механизм в JavaScript, который обеспечивает выполнение кода асинхронно, несмотря на то что JavaScript является однопоточным языком. Он управляет порядком выполнения задач, отложенных вызовов и операций ввода-вывода, позволяя работать без блокировок. Принцип работы event loop заключается в циклическом извлечении задач из очереди и их выполнении, пока очередь не станет пустой. Таким образом, даже продолжительные операции не мешают работе страницы, что позволяет интерфейсу оставаться отзывчивым.

Ставь 👍 если знал ответ, 🔥 если нет.
🤔 Какое свойство CSS используется для управления загрузкой шрифта?
Anonymous Poll
26%
font-loading
36%
font-display
38%
font-style
0%
font-weight
🤔 Что такое DNS?

Это система доменных имен, которая переводит домены, понятные человеку (например, example.com), в IP-адреса серверов.

Ставь 👍 если знал ответ, 🔥 если нет.
🤔 Почему скрипты подключают в самом конце?

Подключение скриптов в конце позволяет:
- Загружать HTML-контент в первую очередь, что обеспечивает быструю отрисовку.
- Избежать блокировки загрузки страницы, так как браузер обрабатывает JavaScript синхронно.
- Позволяет скриптам работать с уже загруженным DOM.
Лучший вариант – использовать атрибут defer в теге script, чтобы скрипт загружался параллельно с HTML.

Ставь 👍, если знал ответ, 🔥 если нет.
🤔 Какое свойство и значение CSS используются для создания скроллбара в элементе, если его контент переполняет размер?
Anonymous Poll
59%
overflow: scroll;
4%
overflow: hidden;
41%
overflow: auto;
2%
overflow: visible;
🤔 Как свойства box-sizing влияют на размеры элемента?

- content-box – ширина и высота не учитывают отступы и границы.
- border-box – размер элемента включает отступы и границы, что делает верстку более предсказуемой.

Ставь 👍 если знал ответ, 🔥 если нет.
🤔 Какое CSS свойство позволяет контролировать интерполяцию значений свойств во время анимации для создания более плавного перехода эффектов?
Anonymous Poll
50%
transition-timing-function
16%
animation-timing
13%
frame-rate-control
25%
smooth-transition
🤔 Какое свойство CSS используется для установки внешних отступов элемента?
Anonymous Poll
13%
padding
2%
border
87%
margin
0%
spacing
🤔 Почему происходит перенаследование селекторов?

CSS-селекторы перенаследуются по следующим причинам:
- Каскадность – приоритет определяется порядком в файле.
- Специфичность – ID имеет больший приоритет, чем класс, а класс – больше, чем тег.
- Наследование – дочерние элементы могут унаследовать свойства своих родителей.

Ставь 👍 если знал ответ, 🔥 если нет.
🤔 Что вернёт следующий код: console.log("5" * 2);?
Anonymous Poll
63%
10
4%
"10"
14%
"52"
19%
Ошибка
Что такое state manager и с какими приходилось работать?

State manager — это инструмент или библиотека для управления состоянием приложения, особенно в сложных проектах с большим количеством взаимозависимых данных. Популярные state manager’ы включают Redux, MobX и Zustand для React-приложений, обеспечивающие централизованное хранение и управление состоянием. Они помогают структурировать данные, отслеживать их изменения и синхронизировать их между компонентами.

Ставь 👍 если знал ответ, 🔥 если нет.
🤔 Какое CSS свойство позволяет анимировать переходы состояний SVG-фильтров на элементе?
Anonymous Poll
22%
filter-animation
44%
transition-filter
25%
animate-filter
9%
filter
🤔 Какое CSS свойство позволяет элементу быть позиционированным в трехмерном пространстве?
Anonymous Poll
8%
transform-style
26%
perspective
41%
3d-transform
28%
transform
🤔 Как функционируют вычисляемые свойства?

- При первом запросе запускается функция, и результат сохраняется.
- Если изменяются зависимости, свойство помечается как «грязное», и при следующем запросе происходит пересчет.
- Это используется для оптимизации, чтобы не выполнять вычисления каждый раз, как в случае с методами.
Важно: вычисляемые свойства не вызывают побочных эффектов, их задача — вычислять значения, а не «что-то делать».

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