FRONT-END РАЗРАБОТЧИК: Как пройти СОБЕСЕДОВАНИЕ? Что нужно ЗНАТЬ?
Разбор вопросов, которые могут встретиться на собеседовании Front-end-разработчика: от cookies, CSS и JavaScript до React, HTTP и TypeScript. Формат построен как разговор ведущего с практикующим разработчиком.
Учебный выпуск в формате собеседования по Front-end: гость Стас Евстифеев сначала рассказывает о переходе из армии в разработку и выборе между крупными и небольшими компаниями, затем отвечает на типовые технические вопросы. Разбираются хранение данных в браузере, кроссбраузерная вёрстка, JavaScript, React, HTTP/CRUD и TypeScript. Акцент сделан на том, чтобы сначала формулировать задачу, а уже затем выбирать API, библиотеку или подход.
Для хранения клиентских данных различайте cookies и localStorage: cookies участвуют в HTTP-запросах и доступны серверу, а localStorage управляется JavaScript; чувствительные логины и пароли туда помещать не следует.
Перед использованием CSS-свойства проверяйте поддержку браузерами, применяйте fallback-значения и располагайте vendor-префиксы перед стандартным свойством, чтобы стандартная версия его переопределяла.
Используйте div и span только как семантически нейтральные блочный и строчный контейнеры; для смыслового выделения текста выбирайте семантические теги, например strong и em.
В новом JavaScript предпочтительны const по умолчанию и let для реально изменяемых значений; var отличается функциональной областью видимости, hoisting и менее предсказуемым поведением.
setTimeout задаёт минимальную задержку, а не точное время выполнения: callback попадёт в очередь и будет исполнен, когда освободится основной поток. setTimeout(..., 0) может дать браузеру возможность отрисовать интерфейс перед тяжёлой синхронной работой.
Для обработки массивов сначала определяйте ожидаемый результат: forEach и for...of подходят для прохода по элементам, filter — для отбора, map — для преобразования в массив той же длины, reduce — для сведения к одному значению.
В React перерисовка зависит от state и props, а новые ссылки на объекты могут вызвать обновление; React Router DOM организует клиентскую маршрутизацию SPA, а generics в TypeScript сохраняют связь между типом входного аргумента и результатом функции.