Как Hexlet помог пройти собеседование на JS-разработчика

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

Компанию, к сожалению, назвать не могу, но зато приведу весь код, который мы с интервьюером написали за оба этапа собеседования. Сразу скажу, что задания не были сложными, скорее даже наоборот, и статья больше подойдет начинающим программистам. После каждого задания постараюсь указать, какой курс на Hexlet можно пройти, чтобы глубже его (задание) понять.

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

var b = {};
var c;

b.b = 1;
c = b;
c.b = 2;

console.log('1)', b.b); // ?
console.log('2)', c.b); // ?

Что появится в консоли после последних двух строк?

Тут нужно понимать, что когда выполнился код, присваивающий переменную b переменной c (c = b), на самом деле в переменной c оказалась ссылка на объект b. Другими словами: теперь и c и b ссылаются на один и тот же объект. Поэтому c.b и b.b выведут одно и то же значение, а именно 2.

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

var a = { counter: 1 };
 function inc(obj) {
     obj.counter++;
     obj.changed = true;
 }

inc(a);
console.log('3)', a);   // ?

Здесь я пытался найти какой-то подвох, но так его и не нашел - мы просто передаем объект в функцию, увеличиваем его свойство counter и устанавливаем новое свойство changed, а после выводим этот объект в консоль. Все довольно просто. Вывод будет таким:

3) { counter: 2, changed: true }

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

В следующем задании интервьюер попросил обработать данные, пришедшие с backend, которые выглядят следующим образом:

var arr = [
    { name: 'score', value: 10 }, 
    { name: 'highScore', value: 20 },
    // ...
  ];

После обработки этих данных мы должны получить объект следующего вида:

 {
   score: 10,
   highScore: 20,
   ...
 }

Собственно задача довольно тривиальная, создать объект, перебрать массив и установить name как свойство объекта, а value как значение.

function objFromArr(arr) {
  const obj = {}
  for (let val of arr) {
    obj[val['name']] = val['value']
  }
}

Решение интервьюера устроило и он спросил что будет, если в массив данных с backend добавится еще одна строка highScore со значением 100.

 {
   score: 10,
   highScore: 20,
   highScore: 100,
   ...
 }

Конечно же, так как в нашем объекте уже есть свойство highScore оно просто обновится и значение 20 поменяется на 100.

Пройдите Hexlet курс JS: Объекты, чтобы узнать все об объектах.

Третьим заданием для меня стал вот такой маленький кусок кода:

  for(var i = 0; i >= 10; i++) {
      setTimeout(function() {
        console.log(i);
      }, 10);
  }

Как и в первом задании, мне необходимо было предсказать вывод в консоль. Здесь я приметил инициализацию переменной с помощью конструкции var и вспомнил её отличия от let. В случае с var переменная будет иметь область видимости функции, в которой она описана, поэтому, когда начнется вывод в консоль, i будет равно 10 и это число будет выведено все 10 раз по одному разу на каждую итерацию. Интервьюер со мной согласился и попросил исправить код так, чтобы в консоли появились числа от 0 до 10 по одному разу, вместо 10 раз по 10. Я поменял var на let, объяснив это тем, что у let область видимости блочная и для каждой итерации переменная будет своей.

Объяснение отличий var от let можно узнать в курсе Hexlet Основы программирования в уроке Цикл while и переменные

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

Так как искомая строка может быть всего одним символом - я решил разбить строку в массив и применить функцию filter, чтобы отфильтровать все подходящие символы, а затем посчитать длину получившегося массива. В итоге код выглядел так:

function count(str, char) {
  return [...str].filter((c) => c == char).length;
}

JS: Коллекции и JS: Функции расскажут все необходимое про массивы и управление ими.

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

Теперь нужно было написать функцию, которая бы удаляла из строки n одинарных кавычек. Я решил сначала пойти простым путем и n раз применить функцию replace, чтобы заменить кавычки на пустую строку. Я думал, меня попросят придумать какое-то более эффективное решение, но этого не последовало. В итоге мой код выглядел следующим образом:

function remove(str, n) {
  for (let i = 0; i < n; i++) {
    str = str.replace('?', '');
  }
  return str;
}

Да, я понимаю, что решение далеко не оптимально и если, например, в строке всего одна кавычка, а в функцию передать n = 1000, то будут выполнены лишние действия, но решение было принято и я не стал настаивать на его улучшении :)

Последним заданием первого этапа было задание из испытания на Hexlet "Сбалансированы ли скобки", что было довольно приятным сюрпризом. Код данного задания приводить не буду, чтобы не спойлерить решение и не лишать вас возможности написать его самостоятельно.

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

В заключении хотелось бы пожелать всем ищущим работу удачи и целеустремленности. Решайте больше задач (благо есть Codebattle), проходите замечательные курсы на Hexlet и у вас обязательно все получится!