Лучшие вопросы и ответы на собеседовании по JavaScript для 2022 года

Самый важный вопрос по JavaScript, который вам задают на собеседованиях, это: Что такое закрытие?

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

Как только вы узнаете эти основы, вы сможете проходить 90% собеседований по JavaScript, начиная с младшего и заканчивая старшим уровнем, ничего не заучивая перед собеседованием.

Итак, в этой статье я покажу вам Топ вопросов для собеседования по JavaScript в 2022 году и как на них отвечать, чтобы вы смогли пройти собеседование и получить ту высокооплачиваемую работу разработчика JavaScript, которую вы заслуживаете.

Если вы предпочитаете не читать, а смотреть, посмотрите эту статью в виде видео на youtube.

Вернемся к закрытиям.

Закрытие позволяет функции получить доступ к тому, что находится за ее пределами. Чтобы по-настоящему понять замыкания, нам нужно понять еще одну ключевую концепцию JavaScript.

Область действия.

Если вы ищете причудливое определение, то область видимости определяет доступность переменных. Пакет переменных, к которым мы имеем доступ в любой момент кода.

Существуют различные области видимости.

У нас есть глобальная область видимости, область видимости блока, функции и модуля.

Глобальная область видимости содержит переменные, к которым имеют доступ все (все остальные области видимости). Когда код выполняется в браузере, глобальной областью видимости является известный объект window. Область видимости блока представляет переменные внутри блока кода. Область видимости функции содержит переменные внутри блока функций. А область видимости модуля содержит переменные, функции и классы, определенные внутри определенного модуля.

Обычно мы имеем доступ к глобальной области видимости и нашей локальной области видимости (область видимости блока или функции вокруг нас). Замыкания дают нам доступ к другой области видимости.

Доступ к объемлющей области видимости с помощью закрытия
В своем происхождении слово «закрытие» происходит от слова «закрывать». Это понятие из функционального программирования относится к «склеиванию» функций с другими вещами. Они позволяют нам получить доступ к тому, что находится вокруг наших функций, к окружающей области видимости (также называемой лексической областью видимости).

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

В чем недостаток использования замыканий?

Каждая функция, которая обращается к «окружающему пространству» с помощью замыканий, несет в себе эту информацию. Как шар с цепью, это оказывает большое давление на нашу память, пока JavaScript не решит, что она больше не нужна (сборка мусора). Если вы хотите, чтобы я написал статью именно о замыканиях, дайте мне знать в комментариях 🙂


Доступ к объемлющей области видимости через замыкания может оказывать давление на память в JavaScript.

Теперь давайте перейдем к следующей основной фундаментальной концепции, о которой часто спрашивают на собеседованиях по JavaScript… Hoisting.

Что же такое «подъем» в JavaScript?

Подъем определяется как поднятие наших деклараций на вершину функции или глобальной области видимости. Это несколько упрощенное определение.

В действительности, переменные и объявления функций никуда не перемещаются.

Они просто посещаются и регистрируются в среде перед выполнением кода. Поэтому JavaScript Engine проверяет функции и объявления переменных перед выполнением кода.

Это подводит нас к следующему вопросу…

Каким образом var, let и const поднимаются?

Проще говоря, все они размещаются в верхней части своей области видимости. При этом let и const не инициализируются, а переменные var инициализируются значением undefined. В то же время помните, что var и let могут быть объявлены без присвоения значения, тогда как const должно быть присвоено значение при объявлении.

Говоря о глобальной области видимости, задавались ли вы когда-нибудь вопросом…

Для чего мы используем this в JavaScript?

Этот вопрос сводит разработчиков с ума и делает JavaScript немного смешным языком. В современных языках программирования, таких как Java, Python или C#, слово this, или self внутри функции, относится к объекту, который вызвал эту функцию.

В нашем звонком JavaScript слово «this» зависит от того, как вызывается функция, а не обязательно от того, кто ее вызвал. Это то, что мы называем контекстом функции.

Контекст в JavaScript — это то, «как мы вызываем» функцию. Особенность контекста в том, что он может быть разным при каждом вызове функции. (если только мы не используем метод bind() для обеспечения этого, если вы хотите, чтобы я написал статью о методе bind и apply, дайте мне знать в комментариях).

Короче говоря: мы используем this для доступа к свойствам глобальной или окружающей области видимости в зависимости от того, как была выполнена функция. В одиночку «this» относится к глобальной области видимости, в которой выполняется код. В объекте «this» относится к свойствам объекта. В функции «this» снова относится к глобальной области видимости.

И это подводит меня к следующему вопросу…

В чем главное преимущество использования стрелочных функций?

Помимо того, что их легче писать и читать… разве эта стрелка не просто суперкрутая?

Именованная стрелочная функция (Источник: Mozilla MDN)

Помимо простого синтаксиса, главное преимущество стрелочных функций заключается в том, что они устраняют неопределенность в вопросе о том, к чему относится «this». В стрелочной функции this всегда относится к лексическому контексту (области видимости), в которой вызывается функция. Так что больше никакой путаницы по поводу «контекста».

Теперь давайте вернемся немного назад во времени с нашим следующим вопросом.

В чем разница между ключевыми словами «var» и «let»?

Этот вопрос относится к 2010 году, но вы можете задать его и сегодня. Основная разница между var и let заключается в том, что область видимости переменной, объявленной с помощью let, является локальной и существует только в текущем блоке кода. Переменная, объявленная с помощью var, существует в глобальной области видимости.

К этому моменту вы, вероятно, уже знаете, что одна интересная концепция всплывает неоднократно. Вы угадали, это область видимости. Все эти вопросы проверяют ваше понимание того, как работает область видимости JavaScript. Вместе с «прототипным наследованием», которое я объясню через несколько секунд, это два фундаментальных столпа JavaScript.


2 основных столпа в JavaScript

Но прежде чем мы перейдем к этому, давайте поговорим еще об одном различии.

В чем разница между «let» и «const»?

Как видно из названия, const сообщает JavaScript, что нечто является константой. Эта переменная не изменится (не будет переназначена). Let сообщает JavaScript, что переменная будет переназначена. Как правило, мы используем let для циклов или счетчиков, поскольку он также сигнализирует, что переменная будет использоваться только в том блоке, в котором она определена.

Const, в свою очередь, не может быть ни обновлена, ни повторно объявлена (что имеет огромные последствия при использовании TypeScript). Если вы хотите, чтобы я углубился в эту тему, напишите мне в комментариях).

Готовы к еще одному вопросу о «различиях»…

В чем разница между «null» и «undefined»?

Переменной со значением null было присвоено значение null. Переменная с неопределенным значением была объявлена, но еще не определена. Она еще не имеет значения. Null и undefined являются примитивными типами данных в JavaScript.

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

Правильно, следующий вопрос…

Что такое «прототипное наследование» в JavaScript?

Проще говоря, прототип — это родитель. Родитель, от которого вы наследуете свои свойства.

Например, когда вы создаете простой массив JavaScript, вы обнаружите, что у него есть такие методы, как map, reduce или length. Вы не добавляли эти методы при создании массива. Они пришли от его родителя, прототипа массива, который встроен в JavaScript.

Прототипное наследование существует в JavaScript с той же целью, что и классы в объектно-ориентированных языках, таких как Java или C#. Они помогают нам быстро повторно использовать свойства и функциональность и не изобретать велосипед.

Каждый раз, когда вы ищете свойство объекта, если оно не найдено, JavaScript также обратится к его прототипу. Все может иметь прототип, а прототип может иметь другой прототип. Это то, что мы называем цепочкой прототипов. Это немного абстрактно, но вы можете представить ее как набор матрешек.

Эта цепочка останавливается только тогда, когда больше не остается прототипов. Вы можете получить доступ к прототипу, используя свойство «prototype» в любом объекте 🙂

Иллюстрация цепочки прототипов.
Поздравляем, вы уже поняли два основных столпа JavaScript как языка программирования. Область применения и наследование прототипов.

Мы закончим с концепциями из другого фундаментального столпа в мире JS: асинхронного программирования, что подводит меня к следующему вопросу.

В чем разница между обратным вызовом и обещанием в JavaScript?

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

Вернемся к обратным вызовам и обещаниям.

Для начала давайте дадим определение этим двум понятиям. Обратный вызов — это функция, которая вызывается после того, как что-то произошло. Это как сказать своему другу: «Эй, когда ты закончишь заказывать тако, возьми эту функцию и запусти ее для меня, «вызови ее обратно».

Мы можем это сделать, потому что в JavaScript функции — это объекты. Объекты, которые можно вызывать или вызывать. Поэтому мы можем передавать их как входные данные другим функциям. Проблема с обратными вызовами заключается в том, что когда вам нужно вложить их много, это приводит к «аду обратных вызовов». Код быстро становится нечитабельным, а помните, мы пишем код для машин и людей.


Ад обратных вызовов

Поэтому Promises пришли на помощь в версии ES6 JavaScript в 2015 году.

Обещание в JavaScript, как и обещание в реальной жизни, — это ожидание того, что мы что-то сделаем. Мы можем либо выполнить данные нами обещания (что, я надеюсь, вы и делаете), либо не выполнить их и отказаться от них. Например, когда вы получаете данные из бэкенда, вы ожидаете, что они придут. Самое приятное, что JavaScript не будет ждать, пока обещание будет выполнено.

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

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

Promise — это встроенный объект в javascript, который позволяет нам писать асинхронный код красиво и избегать ада обратного вызова. Я могу говорить об обещаниях несколько часов, если вы хотите, я напишу более длинную статью на эту тему. Просто дайте мне знать в комментариях.

Раз уж мы заговорили об обещаниях…

В чем разница между Promise и Async/Await?

Ну, по сути, никакой. Async/await только облегчает чтение обещаний последовательно, одно за другим. Когда вы пишете асинхронный код с обещаниями, все еще может выглядеть немного неприятно. У вас есть все эти утверждения, о которых вы не знаете, когда они закроются.

Async/Await значительно облегчает понимание происходящего, поскольку вы поймете, что происходит, читая все по очереди.

Забавно, но Async/Await состоит из обещаний в сочетании с другой страшной концепцией JavaScript — генераторами. Для простоты мы не будем сейчас углубляться в генераторы. Имейте в виду, что в зависимости от уровня, на который вы проходите собеседование, от вас могут потребовать углубиться в эти вещи или нет.

От старших JavaScript-разработчиков ожидается понимание того, как все работает под капотом, в то время как младшие и средние специалисты могут обойтись гораздо меньшим. Эти вопросы — только первый шаг; чтобы успешно пройти собеседование, вы должны сначала убедиться, что избегаете основных ошибок.

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

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

Оцените статью
Procodings.ru
Добавить комментарий