/test-task

Primary LanguageJavaScript

Реализовать в файле solution.js функцию drawNestedSetsTree(data, node), которая принимает на вход два аргумента:

  • data - массив из 0 или более узлов, каждый элемент которого содержит поля title (имя узла), left (левая граница) и right (правая граница). Формат хранения - Nested Sets
  • node - DOM-узел (можете считать что это будет div), в который надо вывести итоговую структуру в виде дерева ul и li

Функция drawNestedSetsTreeвыводит в переданный DOM-узел визуализацию дерева, которое лежит в data.

К примеру для входного аргумента data равного:

[
  {
    title: "Одежда",
    left: 1,
    right: 22
  },
  {
    title: "Мужская",
    left: 2,
    right: 9
  },
  {
    title: "Женская",
    left: 10,
    right: 21
  },
  {
    title: "Костюмы",
    left: 3,
    right: 8
  },
  {
    title: "Платья",
    left: 11,
    right: 16
  },
  {
    title: "Юбки",
    left: 17,
    right: 18
  },
  {
    title: "Блузы",
    left: 19,
    right: 20
  },
  {
    title: "Брюки",
    left: 4,
    right: 5
  },
  {
    title: "Жакеты",
    left: 6,
    right: 7
  },
  {
    title: "Вечерние",
    left: 12,
    right: 13
  },
  {
    title: "Летние",
    left: 14,
    right: 15
  }
];

В узле node должен появиться следующий HTML:

<ul>
  <li>Одежда
    <ul>
      <li>Мужская
        <ul>
          <li>Костюмы
            <ul>
              <li>Брюки</li>
              <li>Жакеты</li>
            </ul>
          </li>
        </ul>
      </li>
      <li>Женская
        <ul>
          <li>Платья
            <ul>
              <li>Вечерние</li>
              <li>Летние</li>
            </ul>
          </li>
          <li>Юбки</li>
          <li>Блузы</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

Обратите внимание на следующие ограничения:

  • запрещено использовать любые библиотеки
  • запрещено использовать любые "украшательства" - выводите голую структуру из тегов ul и li
  • у вас никогда не должно быть пустых тегов (без контента). Относится как к <ul> так и к <li>
  • запрещено изменять любые файлы кроме содержимого функции drawNestedSetsTree в файле solution.js
  • вы можете быть уверены, что предоставленное вам дерево корректно и непротиворечиво

После выполнения задания, разместите ваше решение на gist.github.com и пришлите ссылку на ваше решение (только ссылку) по адресу illya@javascript.ninja с темой письма "Тестовое задание: базовый JavaScript". Пожалуйста, будьте внимательны с темой письма - они будут проверяться автоматически.

По истечении некоторого времени (на старте может исчисляться днями) к вам в gist придёт бот и разместит в комментариях результаты тестов. Если все тесты будут пройдены - вам будет предоставлена ссылка на оплату участия. Именно успешная оплата гарантирует место в группе (количество мест ограничено).

Форматы участия в курсе:

  1. Стандартный - подразумевает доступ ко всем материалам курса + автоматизированная проверка заданий. $100 (количество мест ограничено)
  2. Продвинутый - доступ ко всем материалам курса + индивидуальная проверка ваших заданий лично человеком. $200 (количество мест очень ограничено)

Если у вас остались вопросы - вы можете задать их в Telegram-канале https://t.me/joinchat/CCl4sj1sg0dhrNqckmr4bA Ориентировочная дата начала: 17 июля.