# 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 wird oben bereitgestellt; bitte ändern Sie diesen Code nicht. Ihre Aufgabe besteht darin, 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 von Zahlen und Zeichenfolgen zurückgeben. Sie können die Hinweise und Lösungen überprüfen, wenn Sie Schwierigkeiten haben, dieses Problem zu lösen. Auf diese Weise werden Sie die Informationen besser aufnehmen und Ihre Fähigkeiten verbessern. 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://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')"
  >
    Hint
  </button>
  <button
    class="button"
    onclick="toggleBlock1('solution-block1', 'hint-block1')"
  >
    Solution
  </button>
</div>


<div id="hint-block1" class="block hint-styling-block">
  1. Your goal is to limit the number of iterations in the loop to the length of
  the array. To achieve this, you can use
  <code>i < arrayName.length</code>.<br />
  2. When the number is divisible evenly by 3, you need to replace the array
  element with <b>Fizz</b>. To do this, inside the <code>if</code> condition,
  you should check it using the following condition:
  <code>array[i] % 3 == 0</code>. <br />
  3. You need to do the same with other checks. In the second if block, you
  should check if the number is evenly divisible by 5.<br />
  4. To check two conditions at once, use
  <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 ist für absolute Anfänger konzipiert, die die Grundlagen der Programmiersprache TypeScript beherrschen möchten. TypeScript ist eine moderne und leistungsstarke Sprache, die die Fähigkeiten von JavaScript erweitert und Ihren Code zuverlässiger und lesbarer macht. Wir beginnen mit den Grundlagen, indem wir Variablen, Datentypen, Vergleichsoperatoren und bedingte Anweisungen behandeln. Anschließend werden wir uns mit Arrays und Schleifen beschäftigen. Nach Abschluss dieses Kurses sind Sie bereit, einfache Programme in TypeScript zu erstellen und Ihre Lernreise zu fortgeschritteneren Themen fortzusetzen.

Dieser Abschnitt führt Sie in TypeScript ein. Sie werden lernen, warum TypeScript wertvoll ist und wie es sich von JavaScript unterscheidet.

Wir werden die Kontrolle über den Code übernehmen! In diesem Abschnitt lernst du, wie du Bedingungen für die Codeausführung in TypeScript festlegst. Du wirst entdecken, warum dies verwendet wird und wie man es richtig anwendet, damit dein Code der Neid aller Top-Programmierer wird!

Lassen Sie uns mit einer praktischen Möglichkeit vertraut machen, Daten in einer Sammlung von Elementen zu speichern - einem Array. Sie werden lernen, wie man Arrays erstellt und verwendet, sowie wie man Elemente in einem Array hinzufügt und damit arbeitet. Eine wichtige und grundlegende Struktur für jeden Programmierer.

Automatisieren Sie Aufgaben mit einer großen Menge an Daten oder Variablen. Loops werden Ihnen dabei helfen, eine große Menge an Daten zu verarbeiten und schnell Ergebnisse in nur wenigen Codezeilen zu erzielen. Wir werden die grundlegenden Arten von Loops erkunden und Ihnen beibringen, wie Sie effektiv mit ihnen arbeiten!

Es ist an der Zeit, endlich zu lernen, wie man eigene Funktionen schreibt, die die von Ihnen angegebenen Operationen ausführen. Funktionen helfen Ihnen, Ihren Code zu organisieren, indem sie ihn in handhabbare Teile zerlegen und in einer einzigen Zeile aufrufen. Es ist Zeit zu lernen!

Einführung in TypeScript

Herausforderung (FizzBuzz)

Aufgabe