Frontend Study


Channel's geo and language: Russia, Russian


Изучаем Frontend.
По вопросам сотрудничества: @MiyaFitness

Related channels

Channel's geo and language
Russia, Russian
Statistics
Posts filter


#вопросы_с_собеседований
Какие бывают человеческие ошибки в javascript?

В javascript есть два типа ошибок.
Syntax error. Это ошибки или опечатки в коде, из-за которых программа вообще не выполняется или останавливается на полпути. Обычно появляются сообщения об этих ошибках.

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


JavaScript. Напишите функцию order, которая принимает строку и возвращает её вариант, очищенный от цифр, вшитых в каждое слово, и отсортированный на основе этих цифр.

Ответ


CSS Card Hover Effects

Анимация при наведении на карточки, выполненная на чистом CSS, без использования JavaScript.

https://codepen.io/Jhonierpc/pen/MWgBJpy


Работа с временными интервалами

setInterval используется для выполнения функции через определенные промежутки времени.


#вопросы_с_собеседований
Что произойдет в результате выполнения выражения var a = 1 + "2" и почему?

Переменная a примет значение "12". В JS такое поведение называется приведением типов. Если хоть один из операндов в операторе + является строкой, второй также будет преобразован в строку.


3D glass weather icons

Иконки, сверстанные на HTML и SCSS.

https://codepen.io/onediv/pen/MWQKgmv


Что произойдет, если вы не используете параметр rest в качестве последнего аргумента?

Параметр rest должен быть последним аргументом, так как его задача — собрать все оставшиеся аргументы в массив.

Пример: если вы определите функцию, как показано на картинке, это не будет иметь никакого смысла и вызовет SyntaxError.


#вопросы_с_собеседований
Что такое объект arguments?

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


JavaScript. Напишите функцию duplicateEncode, которая принимает строку и кодирует каждый символ в скобку. Если такой символ только один, то скобка будет открывающая, если несколько, то закрывающая.

Ответ


Что будет выведено в консоль?

Ответ


#вопросы_с_собеседований
Преобразование массива в объект с группировкой и фильтрацией элементов

Напишите функцию, которая на вход принимает массив из студентов, где студент — это объект с полями «имя», «возраст» и «номер группы» {name: string, age: number, groupId: number}, а на выходе возвращает объект, где ключ — это номер группы, а значение — массив из студентов старше 17 лет.

На картинке — решение "в одну строчку". Если возраст студента меньше 18, возвращаем аккумулятор. Если нет, смотрим, есть ли его id группы в аккумуляторе. Если есть, значит в аккумуляторе уже есть массив со студентами, следовательно, добавляем этого студента в него, в противном случае создаём новый массив с текущим студентом и добавляем его в аккумулятор под текущим id группы.


Sidebar Interaction

Боковое меню со светлой и тёмной темами оформления, реализованное с помощью SCSS и библиотеки React.js.

https://codepen.io/aybukeceylan/pen/wvpBmrq


Text Animation

Анимация появляющегося текста. Написана на чистом CSS.

https://codepen.io/stevenlei/pen/MWjdWvp


CSS Responsive animated Accordion

Адаптивный анимированный аккордеон. Реализован с помощью JavaScript и CSS.

https://codepen.io/chriswrightdesign/details/AVENwb


Magnify Glass w/ Zoom

Изначально на картинку накладывается фильтр blur. В js создана логика, благодаря которой фильтр убирается в месте, где находится курсор пользователя.

https://codepen.io/kitjenson/pen/ExLRrgw


90% - SVG Animation

SVG-анимация загрузки. Реализована с помощью JavaScript.

https://codepen.io/Adir-SL/details/zYozoNZ


Motion Blur Step 2

Анимация размытия в движении. Написана на чистом CSS.

https://codepen.io/Nealevf/pen/oNxKZOx


JavaScript. Напишите функцию order, которая принимает строку и возвращает её вариант, очищенный от цифр, вшитых в каждое слово, и отсортированный на основе этих цифр.

Ответ


Как вы можете обойти ограничение однопоточности JavaScript для улучшения производительности вычислительно интенсивной задачи?

Используйте Web Workers для выполнения задач в фоновом потоке.


Toaster

Создано на HTML и SCSS.

https://codepen.io/klaufel/pen/OJQBpVQ

20 last posts shown.