# Aufgabe

Herzlichen Glückwunsch, Sie wurden als Entwickler für das Indie-Spiel 'Snail Simulator' eingestellt. Ihre Aufgabe ist es, die **Bewegungslogik der Schnecke** zu entwerfen. Schnecken sind nicht sehr schnell und jede Schnecke hat ihre eigene Ausdauer. Sie müssen die maximale Distanz berechnen, die die Schnecke zurücklegt, wenn sie für jeden zurückgelegten Meter `2%` ihrer Ausdauer verbraucht. Verwenden Sie eine `while`-Schleife, um dieses Problem zu lösen, und **zeigen Sie das Ergebnis auf dem Bildschirm an**. Viel Erfolg!

let stamina: number = 100;
let distance: number = 0;
const staminaPerMeter: number = 2;

while (stamina > ___) {
    stamina = ___ - ___;
    ___++;
}
console.log(`The snail got tired; it ran ${___} meters. This is a new record, congratulations!`)

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.3/codemirror.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.3/theme/dracula.min.css">


<link rel="stylesheet" href="https://staging-content-media-cdn.codefinity.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/buttons-section/hint-solution-with-copyable-%26%3Dhighlighted-code.css">

<div class="button-container">
  <button class="button" onclick="toggleBlock1('hint-block1', 'solution-block1')">
    Hinweis
  </button>
  <button class="button" onclick="toggleBlock1('solution-block1', 'hint-block1')">
    Lösung
  </button>
</div>


<div id="hint-block1" class="block hint-styling-block">
  1. Dein Ziel ist es, die Lücken (<code>___</code>) mit den notwendigen
  Variablen zu füllen. <br>
  2. Die Schnecke muss <code>stamina</code> <b>über Null</b> haben, um sich zu bewegen.
  <br>
  3. Für jeden Meter, den die Schnecke zurücklegt, verliert sie
  <code>stamina_per_meter</code> Ausdauer.<br>
  4. Wenn die Schnecke Ausdauer verloren hat, sollte die zurückgelegte Strecke um 1 erhöht werden
  (<b>Inkrement</b>).<br>
  5. Gib schließlich die <code>distance</code> aus, die die Schnecke zurückgelegt hat.
</div>

<div id="solution-block1" class="block solution-styling-block">
  
  <textarea id="code-1" class="language-typescript">
let stamina: number = 100;
let distance: number = 0;
const staminaPerMeter: number = 2;

while (stamina > 0) {
    stamina = stamina - staminaPerMeter;
    distance++;
}
console.log(`The snail got tired; it ran ${distance} meters. This is a new record, congratulations!`)</textarea>

  <button class="copy-button" onclick="handleClick1('code-1')">
    <svg width="20" height="20" x="0" y="0" viewBox="0 0 32 32" style="enable-background: new 0 0 512 512" xml:space="preserve" class="">
      <g>
        <path d="m26.121 6.707-3.828-3.828A2.98 2.98 0 0 0 20.172 2H12a3.003 3.003 0 0 0-3 3v1H8a3.003 3.003 0 0 0-3 3v18a3.003 3.003 0 0 0 3 3h12a3.003 3.003 0 0 0 3-3v-1h1a3.003 3.003 0 0 0 3-3V8.829a2.982 2.982 0 0 0-.879-2.122ZM22 5.414 23.586 7H22ZM20 28H8a1.001 1.001 0 0 1-1-1V9a1.001 1.001 0 0 1 1-1h8v3a2.002 2.002 0 0 0 2 2h3v14a1 1 0 0 1-1 1ZM18 9.414 19.586 11H18ZM24 24h-1V12.829a2.982 2.982 0 0 0-.879-2.122l-3.828-3.828A2.98 2.98 0 0 0 16.171 6H11V5a1.001 1.001 0 0 1 1-1h8v3a2.002 2.002 0 0 0 2 2h3v14a1 1 0 0 1-1 1Zm-6-8h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0 4h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0 4h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Z" fill="#a6b8e6" opacity="1" data-original="#000000" class=""></path>
      </g>
    </svg>
  </button>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.3/codemirror.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.3/mode/clike/clike.min.js"></script>


<script src="https://cdn.jsdelivr.net/npm/notiflix@2.7.0/dist/notiflix-aio-2.7.0.min.js"></script>

<script>
  document.addEventListener("readystatechange", (event) => {
    if (event.target.readyState === "complete") {
      onPageLoad1();
    }
  });

  function onPageLoad1() {
    var editor = CodeMirror.fromTextArea(document.getElementById("code-1"), {
      lineNumbers: true,
      mode: "text/x-scala",
      theme: "dracula",
    });

    // ----------> HIGHLIGHT <----------
    editor.markText(
      { line: 0, ch: 0 },
      { line: 0, ch: 0 },
      { className: "specific" }
    );

    // Initially hide both the hint and solution blocks
    hideBlock1("hint-block1");
    hideBlock1("solution-block1");
  }

  // Copy Button handler
  const handleClick1 = (codeBlock) => {
    const textarea = document.getElementById(codeBlock);
    const copiedText = textarea.value;

    navigator.clipboard.writeText(copiedText);

    Notiflix.Notify.Success("Copied to clipboard!", {
      timeout: 2000,
      width: "260px",
      position: "center-top",
      textColor: "#ff5549",
    });
  };

  // Function to toggle the visibility of a block
  const toggleBlock1 = (blockId) => {
    const block = document.getElementById(blockId);

    if (block.style.display === "none" || block.style.display === "") {
      hideBlock1("hint-block1");
      hideBlock1("solution-block1");
      showBlock1(blockId);
    } else {
      hideBlock1(blockId);
    }
  };

  // Function to show a block
  const showBlock1 = (blockId) => {
    const block = document.getElementById(blockId);
    block.style.display = "block";
  };

  // Function to hide a block
  const hideBlock1 = (blockId) => {
    const block = document.getElementById(blockId);
    block.style.display = "none";
  };
</script>

Dieser Kurs richtet sich an absolute Anfänger, die die Grundlagen der Programmiersprache TypeScript erlernen möchten. TypeScript ist eine moderne und leistungsfähige Sprache, die die Möglichkeiten von JavaScript erweitert und den Code zuverlässiger und lesbarer macht. Wir beginnen mit den absoluten Grundlagen, einschließlich Variablen, Datentypen, Vergleichsoperatoren und bedingten Anweisungen. Anschließend beschäftigen wir uns mit der Arbeit mit Arrays und Schleifen. Nach Abschluss dieses Kurses sind Sie in der Lage, einfache Programme in TypeScript zu erstellen und Ihre Lernreise zu fortgeschritteneren Themen fortzusetzen.

Dieser Abschnitt führt in TypeScript ein. Es wird erläutert, warum TypeScript wertvoll ist und wie es sich von JavaScript unterscheidet.

In diesem Abschnitt lernen Sie, wie Sie Bedingungen für die Codeausführung in TypeScript festlegen. Sie erfahren, warum dies verwendet wird und wie Sie es korrekt anwenden, damit Ihr Code höchsten professionellen Ansprüchen genügt.

Lernen Sie eine praktische Methode kennen, Daten in einer Sammlung von Elementen zu speichern – ein Array. Sie erfahren, wie man Arrays erstellt und verwendet sowie wie man Elemente in einem Array hinzufügt und bearbeitet. Eine wichtige und grundlegende Struktur für jeden Programmierer.

Automatisierung von Aufgaben mit einer großen Menge an Daten oder Variablen. Schleifen unterstützen Sie dabei, große Datenmengen zu verarbeiten und Ergebnisse mit nur wenigen Codezeilen schnell zu erzielen. Wir werden die grundlegenden Schleifentypen untersuchen und vermitteln, wie Sie effektiv mit ihnen arbeiten.

Es ist an der Zeit, endlich zu lernen, wie eigene Funktionen geschrieben werden, die die gewünschten Operationen ausführen. Funktionen helfen dabei, den Code zu strukturieren, indem sie ihn in überschaubare Abschnitte unterteilen und mit einer einzigen Zeile aufrufen lassen. Jetzt ist der richtige Zeitpunkt zum Lernen!

Herausforderung: Schneckenspiel

Aufgabe

Awesome!

Herausforderung: Schneckenspiel

Aufgabe