Вопросы на собеседовании для middle frontend-разработчика в 2022 году (часть 3)

Продолжаю тему актуальных для текущего года вопросов для frontend-разработчика. На этот раз я хочу привести список вопросов на позицию middle+/senior в одном известном банке ✅🤫

Вопросы по Javascript:

1. Методы Promise (Promise.all, Promise.allSettled, Promise.race)
2. Какие состояния имеет Promise и что они обозначают (речь о pending, fulfilled, rejected)?
3. Задача. Дан массив [1,1,1,2,4,5]. Нужно вернуть true в случае если в нём есть хотя бы один повторяющийся элемент.
4. Рассказать о Map и Set.
5. Что такое O-большое?
6. Что выведет console.log(1==‘1’) и console.log(1===‘1’) и почему.
7. Что такое стрелочная функция и чем она отличается от обычной?
8. Что такое замыкание?
9. В каком порядке выведется console.log()
   setTimeout(function timeout() { console.log('Таймаут'); }, 0); let p = new Promise(function(resolve, reject) { console.log('Создание промиса'); resolve(); }); p.then(function(){ console.log('Обработка промиса'); }); console.log('Конец скрипта');

   1 2 3 4 5 6 7 8 9 10 11 12 13 14

   setTimeout(function timeout() {     console.log('Таймаут'); }, 0);   let p = new Promise(function(resolve, reject) {     console.log('Создание промиса');     resolve(); });   p.then(function(){     console.log('Обработка промиса'); });   console.log('Конец скрипта');

10. Какие типы данных в JS существуют?
11. Рассказать про call, apply и bind.
12. Как можно скопировать объект (вопрос про Object.assign(), перебор в цикле, Spread оператор, JSON.stringify -> JSON.parse).
13. Как копируется объект (по ссылке или по значению)?
14. Что будет если объекту, объявленному через const, изменить значения полей?
15. Как можно сделать объект иммутабельным? Вопрос об Object.freeze;
16. В чем отличие примитивов от объекта? Ответ: примитивы копируются по значению, объект по ссылке;
17. Прототипное наследование;
18. Что такое виртуальное дерево (как концепция вне контекста React)?
19. Рассказать о процессе рендеринга HTML-страницы;
20. Какие этапы из рендеринга будут задействованы при перерисовке (вопрос про Reflow)?
21. Что такое requestAnimationFrame?
22. Что такое Event Loop?
23. Что находится “под капотом” GraphQl?
24. Разница между a++ и ++a?
25. Что такое чистая функция?
26. Перечислить, что является false в JS? Вопрос о 0, null, false и т.д.

Вопросы по Typescript:

1. Что такое Partial<Type>, Required<Type>, Readonly<Type>, Record<Keys, Type>, Pick<Type, Keys>, Omit<Type, Keys>?
2. Что данная запись обозначает:
   
   // Overload signatures function greet(person: string): string; function greet(persons: string[]): string[]; // Implementation signature function greet(person: unknown): unknown { if (typeof person === 'string') { return `Hello, ${person}!`; } else if (Array.isArray(person)) { return person.map(name => `Hello, ${name}!`); } throw new Error('Unable to greet'); }

   1 2 3 4 5 6 7 8 9 10 11 12 13

   // Overload signatures function greet(person: string): string; function greet(persons: string[]): string[]; // Implementation signature function greet(person: unknown): unknown {   if (typeof person === 'string') { return `Hello, ${person}!`;   } else if (Array.isArray(person)) { return person.map(name => `Hello, ${name}!`);   }   throw new Error('Unable to greet'); }

   
   Вопрос про перегрузку функций в TS

Вопросы по  React:

1. Какие основные хуки существуют? Рассказать про каждый из них.
2. Рассказать, как можно реализовать этапы жизненного цикла компонента через useEffect.

Был еще ряд вопросов в контексте практического примера с использованием локального стейта, но я, к сожалению, уже не вспомню саму реализацию.