Frontend Interview - собеседования по Javascript / Html / Css
10.4K subscribers
2.09K photos
118 videos
320 files
500 links
Канал для подготовки к собеседованиям по фронтенду

Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront

Купить рекламу: https://telega.in/c/frontendinterview

Канал в реестре РКН:
https://rknn.link/su
Download Telegram
Какое из перечисленных ниже слов не является зарезервированным словом в JavaScript?
Anonymous Quiz
33%
default
17%
throw
35%
finally
16%
undefined
Можно ли с помощью метода indexOf определить позицию подмассива в массиве?

Метод indexOf() использует оператор строгого сравнения (===) при сравнении искомого элемента и элементов массива.
Так как сравнение массивов происходит по ссылке, сравнение искомого элемента и элемента массива, который сам является массивом вернет false.
 const arr = [[1], [2], [3]]
const arr2 = [1]

console.log(arr[0] === arr2); //false
Часы

Напишите функцию, которая принимает на вход количство часов, минут и секунд, и преобразует полученное время в миллисекунды.

Пример:
past(0, 1, 1) == 61000
Какое значение в пикселях равно 10vmin, если ширина вьюпорта 800px, а высота 1000px?
Anonymous Quiz
11%
10px
55%
80px
27%
100px
7%
8px
Как строку преобразовать в массив?

Ситуация из реальной жизни. Мы пишем приложение для обмена сообщениями, и посетитель вводит имена тех, кому его отправить, через запятую: Вася, Петя, Маша. Но нам-то гораздо удобнее работать с массивом имён, чем с одной строкой. Как его получить?
Метод str.split(delim) именно это и делает. Он разбивает строку на массив по заданному разделителю delim.
В примере ниже таким разделителем является строка из запятой и пробела.
 names = 'Вася, Петя, Маша';
let arr = names.split(', ');

for (let name of arr) {
alert( `Сообщение получат: ${name}.` ); // Сообщение получат: Вася (и другие имена)
}

У метода split есть необязательный второй числовой аргумент – ограничение на количество элементов в массиве. Если их больше, чем указано, то остаток массива будет отброшен. На практике это редко используется:
 let arr = 'Вася, Петя, Маша, Саша'.split(', ', 2);
alert(arr); // Вася, Петя
Что такое DOM, BOM и window?

Объект Window в клиентском JavaScript является глобальным объектом. Это означает, что объект Window находится на вершине цепочки областей видимости и что его свойства и методы фактически являются глобальными переменными и функциями.

Глобальный объект window можно разделить на три части:
1. Объектная модель документа (DOM) — объект document,через который осуществляется доступ к содержимому страницы.
2. Объектная модель браузера (BOM) — объекты, методы и свойства для работы с браузером.
3. Сам javascript — его объекты, свойства и функции.

BOM состоит из объектов navigator, history, screen, location и document, которые являются дочерними элементами window. В document node находится DOM (Document Object Model), объектная модель документа, которая представляет содержимое страницы. Вы можете манипулировать им с помощью javascript.
Какое из перечисленных CSS свойств НЕ анимируемо?
Anonymous Quiz
68%
display
7%
opacity
16%
font-size
9%
width
Как стать фронтендером в 2021?

✅ Выучить Angular, React или Vue

✅ Выйти на продвинутый уровень по верстке

✅ Прокачаться по Javascript

✅ Освоить английский для IT-шников

Успеешь все?

С курсом "Профессия Frontend-разработчик" от Skillbox точно успеешь,
да еще и по новогодней акции со скидкой 60%
Как происходит построение DOM дерева?

Браузер строит дерево на основе HTML-элементов и других сущностей исходного кода страницы. При выполнении этого процесса он учитывает вложенность элементов друг в друга.

В результате браузер полученное DOM-дерево использует не только в своей работе, но также предоставляет нам API для удобной работы с ним через JavaScript.

При строительстве DOM браузер создаёт из HTML-элементов, текста, комментариев и других сущностей этого языка объекты (узлы DOM-дерева).

При этом браузер не просто создаёт объекты из HTML-элементов, а также связывает их между собой определёнными связями в зависимости от того, как каждый из них относится к другому в коде.

Элементы, которые находятся непосредственно в некотором элементе являются по отношению к нему детьми. А он для каждого из них является родителем. Кроме этого, все эти элементы по отношению друг к другу являются сиблингами (братьями).

При этом в HTML любой элемент всегда имеет одного родителя (HTML-элемент, в котором он непосредствен
Идеальный программист

Книга дядюшки Боба, которая учит методам, практикам и инструментам настоящего мастерства в области программного обеспечения. Она содержит практические советы по оценке проектов, написанию кода, рефакторингу и тестированию.

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

Вам дана строка символов. Переведите каждый символ в ASCII код, затем объедините полученные коды в число
'ABC' --> 'A' = 65, 'B' = 66, 'C' = 67 --> 656667
//назовем полученное число total1

Замените все встречающиеся числа 7 на числа 1
//назовем полученное число total2
total1 = 656667
^
total2 = 656661

Верните разницу между total1 и total2
(6 + 5 + 6 + 6 + 6 + 7)
- (6 + 5 + 6 + 6 + 6 + 1)
-------------------------
6
Программист-прагматик

Издание полно как технических, так и профессиональных практических советов, которые помогли мне во многих проектах, а также помогли мне стать лучше как разработчику.

Книга очень актуальна даже в 2020 году, особенно последнее издание. Здесь автор анализирует, что значит быть современным разработчиком, исследуются различные темы: от личной ответственности и карьерного роста до архитектурных приемов.

Прочитав книгу, вы поймете, что такое непрерывное обучение и насколько оно важно; изучите, как писать гибкий, адаптируемый и динамический код, как решать проблемы конкурентности, как стоять на страже безопасности, как тестировать “безжалостно и эффективно”, и многое другое.
Что такое объектная обертка (Wrapper Objects)?

Примитивы строка, число и boolean имеют свойства и методы, несмотря на то, что они не являются объектами:

 let name = 'marko'

console.log(typeof name) // string
console.log(name.toUpperCase()) // MARKO

Name — это строка (примитивный тип), у которого нет свойств и методов, но когда мы вызываем метод toUpperCase(), это приводит не к ошибке, а к «MARKO».

Причина такого поведения заключается в том, что name временно преобразуется в объект. У каждого примитива, кроме null и undefined, есть объект-обертка. Такими объектами являются String, Number, Boolean, Symbol и BigInt. В нашем случае код принимает следующий вид:

 console.log(new String(name).toUpperCase()) // MARKO

Временный объект отбрасывается по завершении работы со свойством или методом.
Javascript - наш кормилец

Пошаговый план чтобы стать Фулстеком и получать от 80тр, прогая только на JS:

👉 Учим верстку и JS до продвинутого уровня

👉 Учим особенности Node.js

👉 Выбираем фреймворк (React / Angular / Vue)

👉 Пробегаемся по общими штукам (Git / Photoshop / Figma / Английский для IT)

💵 Трудоустраиваемся

Курс Fullstack-разработчик на JavaScript всё это включает, и пройти его можно со скидкой 60%