Fuga da Folha Vetorial Dupla

Introdução

Neste projeto, você aprenderá como desenvolver uma classe RequestControl que coleta solicitações de lançamento de espaçonaves e organiza automaticamente o lançamento do próximo lote de espaçonaves com base nos resultados das espaçonaves. Isso ajudará os humanos a escapar do impacto da "Dual Vector Foil" do problema dos três corpos, que colapsa o espaço tridimensional em um plano bidimensional.

👀 Pré-visualização

🎯 Tarefas

Neste projeto, você aprenderá:

• Como implementar a função run na classe RequestControl para lidar com o lançamento de espaçonaves.
• Como renderizar os resultados do lançamento na página usando a função render.

🏆 Conquistas

Após concluir este projeto, você será capaz de:

• Usar promises (promessas) para simular o processo de lançamento de espaçonaves.
• Gerenciar a fila de lançamento e controlar o número de espaçonaves que podem ser lançadas de cada vez.
• Atualizar a interface do usuário para exibir os resultados do lançamento.

Configurar a Estrutura do Projeto

Nesta etapa, você configurará os arquivos e a estrutura do projeto. Siga as etapas abaixo para concluir esta etapa:

Abra a pasta do projeto. A estrutura do diretório é a seguinte:

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

Dentre eles:

• index.html é a página principal.
• main.js é o arquivo js onde o código precisa ser complementado.

No arquivo main.js:

• O método createRequest é uma promise (promessa) para solicitar o lançamento de uma espaçonave.
• O método addRequest da classe RequestControl coleta solicitações de lançamento de espaçonaves. A solicitação de lançamento da espaçonave é colocada na fila de lançamento this.requestQueue.
• O método run organiza automaticamente o lançamento do próximo lote de espaçonaves com base nos resultados do lançamento.
• O método render é usado para renderizar os resultados do lançamento na página.

Tomando max = 2 como exemplo, o processo de lançamento da espaçonave é o seguinte:

Clique no botão Go Live no canto inferior direito da WebIDE para executar o projeto. Inicialmente, não tem efeito.

Implementar a Função run na Classe RequestControl

Nesta etapa, você implementará a função run na classe RequestControl para organizar automaticamente o lançamento do próximo lote de espaçonaves com base nos resultados do lançamento.

1. Abra o arquivo main.js no projeto fornecido.
2. Localize a função run na classe RequestControl.
3. Dentro da função run, adicione o seguinte código para lidar com o lançamento das espaçonaves:

run() {
  // Get the length of the request queue
  let len = this.requestQueue.length;

  // If the request queue is empty, return
  if (len === 0) return;

  // Get the minimum of the max number of spacecraft and the length of the request queue
  let min = Math.min(this.max, len);

  // Launch the spacecraft one by one
  for (let i = 0; i < min; i++) {
    // Decrement the max number of spacecraft that can be launched
    this.max--;

    // Get the next request from the queue
    let req = this.requestQueue.shift();

    // Launch the spacecraft and handle the result
    req()
      .then((res) => {
        this.render(res);
      })
      .catch((error) => {
        this.render(error);
      })
      .finally(() => {
        // Increment the max number of spacecraft that can be launched
        this.max++;
        // Recursively call the run function to launch the next batch of spacecraft
        this.run();
      });
  }
}

Os pontos-chave da implementação são:

1. Obter o comprimento da fila de solicitações (this.requestQueue.length).
2. Se a fila de solicitações estiver vazia, retornar.
3. Obter o mínimo do número máximo de espaçonaves e o comprimento da fila de solicitações (Math.min(this.max, len)).
4. Lançar as espaçonaves uma por uma, decrementando o número máximo de espaçonaves que podem ser lançadas (this.max--).
5. Lidar com o resultado do lançamento da espaçonave usando os métodos then e catch da promise retornada por req().
6. Incrementar o número máximo de espaçonaves que podem ser lançadas (this.max++) e chamar recursivamente a função run para lançar o próximo lote de espaçonaves.

Testar o Projeto

1. Salve o arquivo main.js.
2. Atualize a página web no seu navegador.
3. Observe os resultados do lançamento exibidos na página. A página deve mostrar os lançamentos bem-sucedidos e falhos das espaçonaves.

O efeito final da página é o seguinte:

Parabéns! Você concluiu a implementação da classe RequestControl para organizar automaticamente o lançamento de espaçonaves. O projeto agora deve estar totalmente funcional.

Resumo

Parabéns! Você concluiu este projeto. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.