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

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

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

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

1. Что такое JavaScript?

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

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

2. Назовите пару преимуществ JavaScript

  • JavaScript может работать автономно прямо внутри браузера.
  • Это мультипарадигмальный язык программирования. Это значит, что мы можем использовать преимущества объектно-ориентированного, функционального и императивного программирования.
  • У него самый большой набор опенсорс-библиотек и фреймворков.
  • На JavaScript можно писать онлайн и офлайн-игры, десктоп-приложения, сайты и мобильные приложения.
  • Нет необходимости изучать несколько языков программирования, чтобы написать фронтенд и бэкенд для сайта. JavaScript поддерживается всеми популярными браузерами. А еще он запускается на сервере с помощью Node.js.
  • Это интерпретируемый язык. Это значит, что нам не нужно собирать и компилировать код перед использованием. Скрипты JavaScript выполняются напрямую.

3. Какой интерфейс JavaScript использовать: внутренний или внешний?

Внутренний JavaScript подойдет для одностраничного сайта. Внешний будет предпочтительней, если страниц у сайта несколько.

4. Почему плагины WordPress вроде Autoptimize объединяют весь код JavaScript в один файл?

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

Допустим, мы добавили 10 JavaScript-файлов в код страницы. Когда мы открываем этот сайт, наш браузер отправляет 10 http-запросов на сервер, чтобы получить их. Лучший выход — объединить эти файлы в один. Благодаря этому запрос к серверу будет лишь один.

5. Что такое «поднятие» в JavaScript?

Подъем — это принцип JavaScript, позволяющий использовать переменные и функции еще до их объявления.

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

Основное преимущество подъема заключается в том, что наш код выполняется без ошибок вроде «переменная не определена» или «функция не определена».

6. Что выведет этот код?

Код

username = "Juan Cruz Martinez";
var username; // объявление переменной
var username; // повторное объявление переменной
console.log(username);

Вывод
Juan Cruz Martinez

Пояснение

  • 2 и 3 строка — это одно объявление переменной.
  • После этого применяется подъем — JavaScript переместит объявленные переменные наверх. Только затем код выполнится.
  • Не забудьте, что значение, которое хранится в переменной, не будет утеряно — даже после повторного объявления.

7. Что такое строгий режим?

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

В этом случае нам понадобится strict mode (строгий режим) JavaScript. По сути, это режим JavaScript, в котором отображаются все ошибки и предупреждения. Это происходит даже в том случае, если по умолчанию они не отображаются.

Чтобы включить строгий режим, нужно написать директиву "use strict" в начале нашего скрипта.

8. Есть ли альтернативы Svelte? Какие?

Svelte — это фреймворк JavaScript, предназначенный для фронтенд-разработки. У него есть несколько популярных альтернатив:

  • React;
  • Vue.js;
  • Angular;

9. Что такое самовызываемые функции?

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

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

Следует отметить, что этим функциям не присваивается имя. То есть, мы не можем вызывать их снова. Также они известны как анонимные функции.

Вот пример самовызываемой функции:

(function (){
	var a = 12;
	var b = 3;
	console.log(a * b);
}());

10. Какие отличия между var, let и const?

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

Let — новый способ объявления переменных в JavaScript. Он был введен с ES6. Область его видимости — блоковая. Повторно объявить переменную через let нельзя.

Const используется для хранения переменных, которые мы не собираемся изменять. Он тоже был введен в ES6. Область видимости — также блоковая.

11. В чем разница между == и ===?

Оба варианта используются в JavaScript для сравнения двух значений.

==  оператор присваивания. Он используется для сравнения двух значений.
===  оператор строгого сравнения. Он сравнивает не только значения, но и типы.

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

Оба этих слова представляют собой пустое значение, но между ними существует два существенных отличия.

Null — мы объявляем переменную и присваиваем ей значение null. Тип null — object.

Undefined — мы объявляем переменную, но не присваиваем ей значение. Тип undefined — undefined.

13. Какая разница между объявлением функции и функциональным выражением

Объявление функции — обычный способ определения функции. Делается с помощью ключевого слова function. Ей присваивается уникальное имя, параметры, тело. Функциональное выражение — объявление функции в качестве переменной.

Важное замечание — подъем не распространяется на функциональные выражения. Это значит, что вы получите ошибку, если вы попытаетесь вызвать их перед определением.

14. Что такое замыкание?

Замыкание в JavaScript — это функция в другой функции. Эта функция имеет доступ к внутренним, внешним и глобальным переменным.

Пример замыкания:

var a = 2;
function outer()
{
	var b = 4;
	
	function inner()
	{
		var c = 6;
		
		console.log(a + b + c);
	}
	
	inner();
}
outer();

15. Что выведут эти две функции? Будет ли результат одним и тем же?

function user1()
{
	return {
		name: "Juan"
	};
}
function user2()
{
	return
	{
		name: "Juan"
	};
}
console.log(user1());
console.log(user2());

Вывод функции user1()
{name: "Juan"}

Вывод функции user2()
undefined

16. Что такое NaN?

NaN значит не-число (Not a Number). Такой тип будет у результата тех действий, которые не могут быть выполнены.

Например, если попытаться разделить строку на число: “Hello World” / 5.

17. Как работает цикл for-in?

Цикл for-in нужен для итерации по свойствам в объекте. В каждой итерации с определенным свойством выполняется прописанное действие.

Наглядный пример:

 var user = {
	"Имя": "Juan",
	"Страна": "Germany",
	"Веб-сайт": "livecodestream.dev"
};
for(var key in user)
{
	if(user.hasOwnProperty(key))
	{
		console.log(key + " -> " + user[key]);
	}
}

Вывод
Имя -> Juan
Страна -> Germany
Веб-сайт -> livecodestream.dev

18.Что такое Event Bubbling и Capturing?

В DOM JavaScript HTML образует особую иерархию — элементы вложены друг в друга.

Допустим, происходит какое-то событие. Какой элемент его выполнит — родительский или дочерний?

Определяется это с помощью двух понятий — event bubbling и capturing.

При event bubbling дочерний элемент захватывает событие, а результат передает в родительский. При capturing — наоборот.

19. Какая разница между JavaScript и ECMAScript?

JavaScript — скриптовый язык. ECMAScript — это набор правил и рекомендаций, созданный для стандартизации JavaScript для различных браузеров.

За создание куки в JavaScript отвечает объект document.cookie. Необходимо присвоить ему строковое значение. Собой оно представляет пару ключ-значение, разделенных точками с запятой.

Пример создания cookie:
<pre><code>document.cookie = "username=Juan; expires=Wed, 03 Oct 2030 12:00:00 UTC; path=/";
</code></pre>

Перевод статьи: 20 Common JavaScript Interview Questions