# Aufgabe

Das klassische Problem heißt FizzBuzz. Die Aufgabe ist sehr einfach: Sie erhalten ein Array mit zufälligen Zahlen, und der Code zur Generierung der Zahlen ist oben angegeben; bitte ändern Sie diesen Code nicht. Ihre Aufgabe ist es, die Array-Elemente gemäß den folgenden Bedingungen zu ersetzen:
- Wenn eine Zahl durch 3 teilbar ist, ersetzen Sie sie durch '`Fizz`';
- Wenn eine Zahl durch 5 teilbar ist, ersetzen Sie sie durch '`Buzz`';
- Wenn eine Zahl sowohl durch 3 als auch durch 5 teilbar ist, ersetzen Sie sie durch '`FizzBuzz`'.

Als Ergebnis sollten Sie ein Array aus Zahlen und Zeichenketten zurückgeben. Sie können die Hinweise und Lösungen überprüfen, falls Sie Schwierigkeiten bei der Lösung dieses Problems haben. Auf diese Weise nehmen Sie die Informationen besser auf und verbessern Ihre Fähigkeiten. Möge die Macht mit Ihnen sein!

let randomNumbers: (number | string)[] = [];

// do not change the code below
for (let i = 0; i < 15; i++) {
  let randomNumber: number = Math.floor(Math.random() * 100); // Generating a random number from 0 to 99
  randomNumbers.push(randomNumber);
}
//do not change the code above

for (let i = 0; i < ___; i++) {
    // Assert that randomNumbers[i] is a number before using the modulus operator
    let num = randomNumbers[i] as number;
  
    if (___) {
        randomNumbers[i] = '___'
    } else if (___) {
        ___ = 'Fizz'
    } else if (___) {
        ___
    }
}

console.log(randomNumbers);

<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 Anzahl der Schleifen-Durchläufe auf die Länge des Arrays zu begrenzen. Dafür kannst du
  <code>i < arrayName.length</code> verwenden.<br>
  2. Wenn die Zahl ohne Rest durch 3 teilbar ist, musst du das Array-Element durch <b>Fizz</b> ersetzen. Das machst du, indem du innerhalb der <code>if</code>-Bedingung folgende Überprüfung verwendest:
  <code>array[i] % 3 == 0</code>. <br>
  3. Das Gleiche musst du auch für die anderen Überprüfungen machen. Im zweiten if-Block solltest du prüfen, ob die Zahl ohne Rest durch 5 teilbar ist.<br>
  4. Um zwei Bedingungen gleichzeitig zu prüfen, verwende
  <code>condition_1 && condition_2</code>.<br>
</div>

<div id="solution-block1" class="block solution-styling-block">
  
  <textarea id="code-1" class="language-typescript">
let randomNumbers: (number | string)[] = [12, 15, 10];

// do not change the code below
for (let i = 0; i < 15; i++) {
  let randomNumber: number = Math.floor(Math.random() * 100); // Generating a random number from 0 to 99
  randomNumbers.push(randomNumber);
}
//do not change the code above

for (let i = 0; i < randomNumbers.length; i++) {
    // Assert that randomNumbers[i] is a number before using the modulus operator
    let num = randomNumbers[i] as number;

    if (num % 3 == 0 && num % 5 == 0) {
        randomNumbers[i] = 'FizzBuzz';
    } else if (num % 3 == 0) {
        randomNumbers[i] = 'Fizz';
    } else if (num % 5 == 0) {
        randomNumbers[i] = 'Buzz';
    }
}

console.log(randomNumbers);</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: Fizzbuzz

Aufgabe

Awesome!

Herausforderung: Fizzbuzz

Aufgabe