Побег из двумерного векторного фольга

JavaScriptBeginner
Практиковаться сейчас

Введение

В этом проекте вы научитесь создавать класс RequestControl, который собирает запросы на запуск космических аппаратов и автоматически планирует запуск следующей партии аппаратов на основе результатов работы предыдущих. Это поможет людям избежать воздействия "Двойного векторного фольга" трехтело-решения, которое сжимает трехмерное пространство в двумерную плоскость.

👀 Предварительный просмотр

Предварительный просмотр симуляции запуска космических аппаратов

🎯 Задачи

В этом проекте вы научитесь:

  • Как реализовать функцию run в классе RequestControl для обработки запуска космических аппаратов.
  • Как отобразить результаты запуска на странице с использованием функции render.

🏆 Достижения

После завершения этого проекта вы сможете:

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

Настройка структуры проекта

В этом шаге вы настроите файлы и структуру проекта. Следуйте шагам ниже, чтобы выполнить этот шаг:

Откройте папку проекта. Структура каталогов следующая:

├── index.html
└── main.js

В которой:

  • index.html - главная страница.
  • main.js - js-файл, в котором необходимо дополнить код.

В файле main.js:

  • Метод createRequest - это promise для запроса на запуск космического аппарата.
  • Метод addRequest класса RequestControl собирает запросы на запуск космических аппаратов. Запрос на запуск космического аппарата помещается в очередь запусков this.requestQueue.
  • Метод run автоматически планирует запуск следующей партии космических аппаратов на основе результатов запуска.
  • Метод render используется для отображения результатов запуска на странице.

В качестве примера возьмем max = 2. Процесс запуска космических аппаратов выглядит следующим образом:

Диаграмма процесса запуска космических аппаратов

Нажмите кнопку Запустить в нижнем правом углу WebIDE, чтобы запустить проект. Начально это не имеет эффекта.

Реализовать функцию run в классе RequestControl

В этом шаге вы реализуете функцию run в классе RequestControl, чтобы автоматически планировать запуск следующей партии космических аппаратов на основе результатов запуска.

  1. Откройте файл main.js в предоставленном проекте.
  2. Найдите функцию run в классе RequestControl.
  3. Внутри функции run добавьте следующий код для обработки запуска космического аппарата:
run() {
  // Получите длину очереди запросов
  let len = this.requestQueue.length;

  // Если очередь запросов пуста, вернитесь
  if (len === 0) return;

  // Получите минимальное значение между максимальным количеством космических аппаратов и длиной очереди запросов
  let min = Math.min(this.max, len);

  // Запустите космические аппараты по одному
  for (let i = 0; i < min; i++) {
    // Уменьшите максимальное количество космических аппаратов, которые могут быть запущены
    this.max--;

    // Получите следующий запрос из очереди
    let req = this.requestQueue.shift();

    // Запустите космический аппарат и обработайте результат
    req()
   .then((res) => {
      this.render(res);
    })
   .catch((error) => {
      this.render(error);
    })
   .finally(() => {
      // Увеличьте максимальное количество космических аппаратов, которые могут быть запущены
      this.max++;
      // Рекурсивно вызовите функцию run, чтобы запустить следующую партию космических аппаратов
      this.run();
    });
  }
}

Основные моменты реализации:

  1. Получите длину очереди запросов (this.requestQueue.length).
  2. Если очередь запросов пуста, вернитесь.
  3. Получите минимальное значение между максимальным количеством космических аппаратов и длиной очереди запросов (Math.min(this.max, len)).
  4. Запустите космические аппараты по одному, уменьшая максимальное количество космических аппаратов, которые могут быть запущены (this.max--).
  5. Обработайте результат запуска космического аппарата с использованием методов then и catch промиса, возвращаемого функцией req().
  6. Увеличьте максимальное количество космических аппаратов, которые могут быть запущены (this.max++) и рекурсивно вызовите функцию run, чтобы запустить следующую партию космических аппаратов.

Тестировать проект

  1. Сохраните файл main.js.
  2. Обновите веб-страницу в вашем браузере.
  3. Наблюдайте за результатами запуска, отображаемыми на странице. На странице должны быть показаны успешные и неудачные запуски космических аппаратов.

Финальный вид страницы следующий:

Отображение результатов запуска космических аппаратов

Поздравляем! Вы завершили реализацию класса RequestControl для автоматического планирования запуска космических аппаратов. Теперь проект должен быть полностью функциональным.

Резюме

Поздравляем! Вы завершили этот проект. Вы можете практиковаться в более многих лабораторных работах в LabEx, чтобы улучшить свои навыки.

✨ Проверить решение и практиковаться✨ Проверить решение и практиковаться✨ Проверить решение и практиковаться