Je ontwikkelt een programma voor een bank dat de **commissie moet berekenen** op basis van het type transactie. De opdracht is om een `switch`-statement te schrijven die de commissie bepaalt op basis van het type binnenkomende transactie.

Commissietarieven per transactietype:

- `Payment`: 0,5%;
- `Transfer`: 1,2%;
- `Withdrawal`: 2,0%;
- `Deposit`: 0,0% (geen commissie).

Vervang `___` door de benodigde code om het te laten compileren. Raadpleeg gerust de **hint en oplossing** om de opdracht beter te begrijpen.

let transactionType: string = "Transfer"; // You can change the operation type
let commission: number;

switch (transactionType) {
    case ___:
        ___ = 0.5;
        break;
    case ___:
        ___ = ___;
        break;
    case ___:
        ___ = ___;
        break;
    case ___:
        ___ = ___;
        break;
    ___:
        ___ = -1; // Handle unknown transaction types
}

console.log(`Commission for ${transactionType}: ${commission}%`);

<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. In elk geval moet je de stringnaam van de bewerking schrijven, waarvan je de lijst kunt zien in de taakomschrijving. <br>
  2. Binnen het <code>case</code> blok, wijs je voor elk type bewerking de juiste commissiewaarde toe aan de variabele. Als de bewerking onbekend is, moet de commissie <code>-1</code> zijn.<br>
  3. Vergeet het <code>default</code> blok niet.
</div>

<div id="solution-block1" class="block solution-styling-block">
  
  <textarea id="code-1" class="language-typescript">
let transactionType: string = "Transfer";
let commission: number;

switch (transactionType) {
    case "Payment":
        commission = 0.5;
        break;
    case "Transfer":
        commission = 1.2;
        break;
    case "Withdrawal":
        commission = 2.0;
        break;
    case "Deposit":
        commission = 0.0;
        break;
    default:
        commission = -1; // Handle unknown transaction types
}

console.log(`Commission for ${transactionType}: ${commission}%`);</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: Commissieberekening

Awesome!

Uitdaging: Commissieberekening