Пять типичных вопросов по JavaScript при собеседовании на работу

Разработчики JavaScript широко востребованы в it-индустрии. Так, при желании повысить, к примеру, свой оклад, недостатка в вариантах трудоустройства, как правило, не бывает. Однако, прежде чем устроиться на работу, необходимо на практике продемонстрировать свои знания и пройти собеседование. В этой стать будут рассмотрены 5 типичных вопросов, задаваемых кандидату при собеседовании, чтобы оценить его знания по JavaScript.

Вопрос 1-ый: Область видимости (scope)

Возьмем следующий код:

jQuery

(function() {
   var a = b = 5;
})();

console.log(b);

Что что покажет консоль?

Ответ

Код выше выведет 5.

Подвох заключается в том, что IIFE (немедленно выполняемая функция) имеет два присваивания, но переменная a объявлена посредством ключевого слова var. То есть a - это локальная переменная функции, а b, напротив, присваивается глобальной области видимости/действия.

Одним подвохом вопрос не ограничивается: внутри функции (строгий режим) ('usestrict';) не применяется. В случае его применения код выдал бы ошибку "UncaughtReferenceError: bisnotdefined". Надо помнить, что жесткий режим требует, чтобы вы явно ссылались на глобальную область видимости, если так было задумано. То есть вы должны написать следующее:

jQuery

(function() {
   'use strict';
   var a = window.b = 5;
})();

console.log(b);

Вопрос 2-ой: Создайте «нативные» методы

Опишите функцию repeatify объекта String. Функция принимает целое число. Число определяет сколько раз необходимо дублировать строку. Функция возвращает повторяемую строку столько раз, сколько было заранее определено. Пример:

console.log('hello'.repeatify(3));

Будет выведено: hellohellohello.

Ответ

Возможное решение показано ниже:

Javascript

String.prototype.repeatify = String.prototype.repeatify || function(times) {
   var str = '';

   for (var i = 0; i < times; i++) {
      str += this;
   }

   return str;
};

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

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

Javascript

String.prototype.repeatify = String.prototype.repeatify || function(times) {/* code here */};

Этот прием особенно полезен, когда просят заклинить JavaScript функцию.

Вопрос 3-ий: Подъем (Hoisting)

Каким будет результат выполнения этого кода и почему?

Javascript

function test() {
   console.log(a);
   console.log(foo());

   var a = 1;
   function foo() {
      return 2;
   }
}

test();

Ответ

Результат будет – undefined и 2.

Причина: переменная и функции подняты (перемещены на верх функции), а назначенные переменным значения потеряны. То есть, когда переменная выводится в консоли, она существует в функции (объявлена), но еще undefined. Другими словами, код выше равнозначен следующему:

Javascript

function test() {
   var a;
   function foo() {
      return 2;
   }

   console.log(a);
   console.log(foo());

   a = 1;
}

test();

Вопрос 4-ый: как работает this в JavaScript

Каким будет результат следующего кода? Обоснуйте ответ.

Javascript

var fullname = 'John Doe';
var obj = {
   fullname: 'Colin Ihrig',
   prop: {
      fullname: 'Aurelio De Rosa',
      getFullname: function() {
         return this.fullname;
      }
   }
};

console.log(obj.prop.getFullname());

var test = obj.prop.getFullname;

console.log(test());

Ответ

Код выведет AurelioDeRosa и JohnDoe. Причина: контекст функции (то, на что ссылается ключевое слово this) в JavaScript зависит от того, как функция вызывается, а не определяется.

В первом console.log(), getFullname() вызывается как функция объекта obj.prop. Таким образом, контекст ссылается на последний объект и функция возвращает fullname свойство данного объекта. С другой стороны, когда переменной test присваивается getFullname(), контекст ссылается на глобальный объект (window). Это объясняется тем, что переменная test по умолчанию установлена как свойство глобального объекта. Именно по этой причине функция возвращает значение свойства fullname от window, которое в нашем случае определенно в первой строке сниппета.

Вопрос 5-ый: call() и apply()

Возвращаясь к 4 вопросу, сделайте так, чтобы последний console.log() выводил AurelioDeRosa.

Вопрос может быть решен путем переопределения контекста функции. Для этого можно использовать методы call() или apply(). Если вам неизвестны эти функции, советую обратиться к статье Методы javascript call и apply . В коде ниже используется метод call(), однако в нашем случае метод apply() даст тот же результат:

Javascript

console.log(test.call(obj.prop));

Заключение

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

источник