Ответы на задачи с собеседования Яндекс Bootcamp

Доброго времени суток, дорогие мои!

Наконец-то руки дошли написать разбор задач с собеседования в Яндекс, которое проходило в октябре 2018 года. Эти задачки предназначались для первичного интервью, которое проходит по скайпу.

Задача №1. Как отрендерится код (флоат и pos:rel)?

// Как отрендерится код (флоат и pos:rel)?
<div style="float: left; border: 1px solid red;">
   <span style="position: relative; top: -1000px; left: -1000px; border: 1px solid green;">
      Inner text
   </span>
</div>

Решение:

Будет отрисован белый квадрат с красной рамкой в левом верхнем углу (из-за float: left). Квадрат будет пустым, так как текст «Inner text» будет вырван из нормального потока элементов и улетит вверх на 1000 рх и вправо на 1000 рх.

Задача №2. Напишите код, который при клике на любой div внутри root будет выводить в консоль его id . Можно использовать jQuery

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

// Напишите код, который при клике на любой  div внутри  root будет выводить в консоль его  id . Можно использовать jQuery
<div id="root" style="background: red;">
    root
    <span id="id1" style="background: lightblue;">id1</span>
    <div id="id2" style="background: green;">
        id2
        <div id="id3" style="background: yellow;">id3</div>
    </div>
</div>

Решение:

let root = document.querySelector('#root');
root.addEventListener('click', event => {
  if (event.target.tagName == 'DIV') {
     console.log(event.target.id);
  }
}, false);

Находим с помощью document.querySelector корневой элемент, т.к. id на странице должен быть только один, то такая запись будет допустима. Чтобы не вешать обработчик события click на каждый элемент DOM-дерева мы можем повесить обработчик событий только на корневой элемент и отловить событие, когда оно всплывает. Внутри обработчика добавляем условие, что если  свойство объекта target tagName является 'DIV' (имена тэгов DOM-дерева записываются в верхнем регистре), то выводим в консоль его id, обратившись к нему через точечную нотацию и записав как event.target.id.

Третий параметр addEventListener мы можем опустить, т.к. запрет на всплытие событий по умолчанию стоит false.

Задача №3. Что выведет данный код?

А вот и задачка на объекты и запись их свойств.

// Что выведет данный код?
var b = {};
var c;

b.b = 1;
c = b;
c.b = 2;
console.log('1)', b.b); // ?
console.log('2)', c.b); // ?
inc(a);
console.log('3)', a);   // ?

var d = 'test';
d.d = 1;
console.log('4)', d.d); // ?
d: {
    'counter': 2,
    'changed': true
}

Решение:

Интерпретатор, прочитав код до конца,  выдаст синтаксическую ошибку из-за того, что неправильно записан объект d. Если исправить : на =, то скрипт прочитается, выполнив первые 2 console.log, и упадет на inc (a), возбудив ReferenceError: inc is not defined, т.к. inc не была объявлена.

 

Задача №4. Преобразование массива  в объект

Необходимо написать код, который преобразует массив в объект.

// На входе массив
var arr = [
 {name: 'width', value: 10},
 {name: 'height', value: 20}
];
// На выходе объект {width: 10, height: 20}

Решение

const a = {}
arr.forEach(el => {
    a[el.name] = el.value;
})

Можем воспользоваться методом forEach, с помощью которого мы итерируемся по массиву arr и обращаемся к каждому элементу. В объекте а имени свойства присваивается значение, которое хранится в name.

Задача №5. Преобразование строки  в новую строку

//Дана строка, состоящая из букв A-Z:
//AAAABBBCCXYZDDDDEEEFFFAAAAAABBBBBBBBBBBBBBBBBBBBBBBBBBBB
//Нужно написать функцию RLE, которая на выходе даст строку вида:
//A4B3C2XYZD4E3F3A6B28
function rle(str) {
  // your code
}

Решение:

function rle(str) {
    let result = '';

    for (let i = 0, count = 1; i < str.length; i ++;) {
      const temp = str[i]; 

      if (str[i + 1] == str[i] ) {
          count++;
      } else {
          if (count > 1) {
              result += temp + count;
          } else {
              result += temp;
        }
    }
    return result;
}

Ну вот в принципе как-то так... Если есть способ лучше, пишите комментарии и до новых встреч!

3 комментария для “Ответы на задачи с собеседования Яндекс Bootcamp

  • Решение задачи номер 5.

    function rel (str) {

    let result = '';

    for (let i = 0, count = 1; i 1) {

    result += count;

    count = 1;

    }

    }

    }

    return result;

    }

  • В 3-ей задаче не понял почему заменить : на = это верно. Почему?

  • d : {'что-то там'} — здесь синтаксическая ошибка. Так записываются только свойства объекта, т.е. это было бы правильным, если бы d : {'что-то там'} был вложен в переменную d, которая бы была объектом.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Advertisment ad adsense adlogger