Проходя собеседования в этом году на позицию middle frontend-разработчик, я решил собрать вопросы, которые сейчас задают наши с вами опытные коллеги. И так, поехали:
0️⃣ Что выведет консоль?
|
1 2 3 4 |
console.log(1); setTimeout(() => console.log(2), 1000); setTimeout(() => console.log(3), 500); console.log(4); |
1️⃣ Что выведет консоль?
|
1 |
console.log(0.1 + 0.2 == 0.3) |
2️⃣ Классы, наследование, доступ к родительскому классу через super();
3️⃣ Что такое new?
4️⃣ Что такое замыкание?
5️⃣ Рассказать про контекст this;
6️⃣ Что выведет консоль?
|
1 |
console.log(1 + '2'); |
7️⃣ Что вернет функция?
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
function f() { let array = []; let index = 0; while(index < 5) { function item() { console.log(index); } array.push(item); ++index; } return array; }; let f2 = f(); f2[0](); |
8️⃣ Ограничения для использования React хуков. Имеется ввиду где в коде компонента можно их использовать, а где нет и почему;
9️⃣ Как можно прокинуть value, чтобы получилось 2
|
1 2 3 4 5 |
const [value, setValue] = useState(0)
; 1) setState(2)
; 2) setState(value + 1); setState(value + 1)
; 3) setState(value => value + 1); setState(value => value +1); |
1️⃣0️⃣ Тайпскрипт. Как описать в интерфейсе компонента:
— value, которое может быть строкой или числом;
— функцию getValue, которая возвращает value;
— функцию setValue, которая принимает параметры и сетает value;
1️⃣1️⃣ Вопрос для рассуждения. Есть стор (Redux или MobX — не важно) и два подхода к хранению данных в нем:
1) Все стейты вынесены в этот стор, компоненты не имеют локальных стейтов;
2) В стор вынесены всего два стейта, а остальное хранится в компонентах.
Нужно рассказать о минусах таких подходов;
1️⃣2️⃣ Что появится в DOMе если вызвать компоненты следующим образом:
|
1 2 3 4 |
<> <name/> <User/> <> |
Кастомные тег, компонент или ошибка?
1️⃣3️⃣ CSS-свойства, которые нежелательно использовать для анимации элементов, т.к. они будут вызывать перерисовку;
1️⃣4️⃣ Какие свойства нельзя назначать для блока если мы используем БЭМ-методологию;
1️⃣5️⃣ Вес селекторов. С каким цветом будет отображаться текст?
|
1 2 3 4 5 6 7 |
<div id="id" class="class"> <span>Some text</span> </div> .class span {color: red}; #p > span {color: green}; #p span {color: blue}; |
1️⃣6️⃣ Есть элемент, стилизованная под ссылку и элемент, стилизованная под кнопку. Первый элемент открывает попап, второй — редиректит юзера на страницу с корзиной. Какие теги нужно использовать в этих случаях?
1️⃣7️⃣ Браузерные способы хранения информации (cookies, session storage, local storage) и их основные различия;