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

Сотрудничество: @cyberJohnny
Download Telegram
🤔 В чем разница == и ===?

== сравнивает значения с приведением типов, что может приводить к неожиданным результатам, тогда как === сравнивает как значения, так и типы данных. Это означает, что === является более строгим оператором и не выполняет автоматическое преобразование типов. Например, 1 == '1' вернёт true, а 1 === '1' — false. Использование === более предпочтительно для избежания ошибок.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
👍1
🤔 Как в CSS заставить текст переноситься на новую строку в пределах блока, если он не помещается?
Anonymous Poll
71%
text-wrap: wrap;
11%
text-overflow: wrap;
9%
white-space: nowrap;
11%
white-space: normal;
🤔 Какое значение свойства CSS transform наклоняет элемент по горизонтали?
Anonymous Poll
48%
skewX()
13%
skewY()
39%
rotate()
3%
rotate()
🤔 Отличие от и от ?

- и — визуальные теги (курсив, жирный), не несут смысловой нагрузки;
- и — семантические, используются для логического акцента (эмоции, важность).

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🎉1
🤔 Какое CSS свойство применяется для установления алгоритма сжатия контента внутри блока, когда он не умещается в отведенное пространство?
Anonymous Poll
18%
content-zip
27%
compress
27%
overflow-style
27%
content-compress
🤔 Какое значение свойства CSS will-change используется для оптимизации будущих изменений свойств элемента?
Anonymous Poll
30%
transform
11%
opacity
0%
scroll
59%
Все вышеперечисленные значения
🤔 Почему React лучше, чем jQuery?

1. Модульность: React позволяет разделять интерфейс на компоненты, что улучшает читаемость и переиспользуемость кода.
2. Virtual DOM: React обновляет только изменённые части DOM, повышая производительность.
3. Однонаправленный поток данных: Упрощает управление состоянием по сравнению с jQuery, где часто возникает путаница в изменениях.
4. Совместимость: React лучше подходит для сложных приложений, благодаря поддержке современных технологий и инструментов, таких как Redux и Context API.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Какой метод JavaScript применяется для создания глубокой копии объекта, включая все вложенные объекты и массивы?
Anonymous Poll
51%
JSON.parse(JSON.stringify())
14%
Object.clone()
40%
Object.deepCopy()
0%
Array.from()
🤔 Какой метод JavaScript используется для создания функции, которая, когда вызвана, имеет её this связанное с указанным значением?
Anonymous Poll
29%
call()
11%
apply()
60%
bind()
0%
attach()
🤔 Как можно вставить svg в HTML-документ?

- Через
- Через
- Через
- Прямо в разметке — inline SVG

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Какое CSS свойство позволяет элементу частично или полностью исчезать, создавая эффект прозрачности на уровне отдельных частей элемента?
Anonymous Poll
89%
opacity
8%
visibility
3%
fade
0%
alpha
🤔 Что известно про систему сборки проектов?

Система сборки отвечает за автоматизацию подготовки проекта к запуску, включая:
- компиляцию и минификацию;
- сборку модулей;
- транспиляцию кода (например, Babel);
- упаковку стилей и скриптов;
- копирование ассетов;
- запуск тестов.
Примеры: Webpack, Vite, Parcel, Rollup.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Какое значение будет у переменной z после выполнения выражения: let z = "3" * "3";?
Anonymous Poll
15%
"33"
55%
9
23%
NaN
8%
"9"
🤔 Как будет выглядеть API?

API — это интерфейс взаимодействия между клиентом и сервером. Он представлен маршрутами, методами, форматами входных и выходных данных. Обычно описан в виде эндпоинтов с параметрами и ответами.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Какое CSS свойство используется для создания многоколоночного макета текста?
Anonymous Poll
48%
column-count
13%
text-flow
13%
multi-column
26%
text-columns
🤔 Какое значение свойства CSS scroll-behavior задает плавную прокрутку?
Anonymous Poll
0%
auto
80%
smooth
9%
linear
11%
ease
🤔 Что известно про оптимизацию?

- Минификация CSS, JS, изображений;
- Использование кеширования;
- Lazy loading компонентов и ресурсов;
- Уменьшение reflow/repain DOM;
- Оптимизация рендеринга (например, will-change);
- Анализ Lighthouse/DevTools.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Какое значение будет в переменной g после выполнения следующего кода?
let g = new Map([[1, 'a'], [2, 'b']]);
let h = Array.from(g.keys());
Anonymous Poll
48%
[1, 2]
28%
['a', 'b']
12%
[['a'], ['b']]
12%
[1, 2, 'a', 'b']
🤔 Как задать свои свойства массиву?

Массив — это объект, можно добавлять свойства как обычному объекту.

Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚
🤔 Какое значение CSS свойства position позволяет элементу быть позиционированным в контексте ближайшего позиционированного предка, вместо исходного контейнера?
Anonymous Poll
55%
absolute
32%
relative
6%
fixed
13%
sticky