Deze code bevat enkele **syntaxisfouten**. De opdracht is om de locaties van de fouten te identificeren en deze uit te commentariëren zodat de code succesvol kan worden uitgevoerd.

let one : number = 5;
let two : string = one ** 4;
let result = two - one;
console.log('code has been executed succesfully')
console.log(`the result is ${result}`)

<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')">
    Hint
  </button>
  <button class="button" onclick="toggleBlock1('solution-block1', 'hint-block1')">
    Oplossing
  </button>
</div>


<div id="hint-block1" class="block hint-styling-block">
  1. Om de <b>enkele-regel</b> opmerking te gebruiken kun je <code>//</code> gebruiken. <br>
  2. Om de <b>meer-regelige</b> opmerking te gebruiken, gebruik <code>/* */</code>.
</div>

<div id="solution-block1" class="block solution-styling-block">
  
  <textarea id="code-1" class="language-typescript">
let one : number = 5;
//let two : string = one ** 4;
let result = /*two - */one;
console.log('code has been executed succesfully')
console.log(`the result is ${result}`)</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>
  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";
  };

  const imgElement1 = document.createElement("img");
  imgElement1.src = "nonexistent-image";
  imgElement1.style.display = "none";
  imgElement1.onerror = onPageLoad1;

  document.body.appendChild(imgElement1);
</script>

Deze cursus is bedoeld voor absolute beginners die de basisprincipes van de programmeertaal TypeScript willen beheersen. TypeScript is een moderne en krachtige taal die de mogelijkheden van JavaScript uitbreidt, waardoor uw code betrouwbaarder en leesbaarder wordt. We beginnen bij de absolute basis, waaronder variabelen, gegevenstypen, vergelijkingsoperatoren en conditionele instructies. Vervolgens gaan we dieper in op het werken met arrays en lussen. Na het voltooien van deze cursus bent u in staat om eenvoudige programma's in TypeScript te maken en uw leertraject voort te zetten naar meer geavanceerde onderwerpen.

Deze sectie introduceert TypeScript. U leert waarom TypeScript waardevol is en hoe het verschilt van JavaScript.

We nemen de controle over de code. In deze sectie leer je hoe je voorwaarden instelt voor code-uitvoering in TypeScript. Je ontdekt waarom dit wordt gebruikt en hoe je het correct toepast, zodat je code voldoet aan professionele standaarden.

Maak kennis met een handige manier om gegevens op te slaan in een verzameling elementen: een array. U leert hoe u arrays maakt en gebruikt, evenals hoe u elementen aan een array toevoegt en ermee werkt. Een belangrijke en fundamentele structuur voor elke programmeur.

Automatiseer taken met grote hoeveelheden data of variabelen. Lussen helpen hierbij, zodat u grote hoeveelheden data kunt verwerken en snel resultaten behaalt met slechts enkele regels code. We behandelen de fundamentele typen lussen en leren u hoe u hier effectief mee werkt.

Het is tijd om te leren hoe u uw eigen functies schrijft die de door u gespecificeerde bewerkingen uitvoeren. Functies helpen u uw code te organiseren door deze op te delen in beheersbare stukken en ze met één regel aan te roepen. Tijd om te leren!

Uitdaging: Correctie van Codesyntaxis

Awesome!

Uitdaging: Correctie van Codesyntaxis