← React / TypeScript

React / TypeScript · 03 / 18

Operatoren, Vergleiche und if

Du wählst anhand einer Bedingung zwischen verschiedenen Abläufen.

  • Klein
  • Grundlagen
  • 15 min

Voraussetzungen: Variablen und Datentypen in JavaScript

Eine Bedingung ist ein Ausdruck, dessen Ergebnis einen Zweig auswählt. Wir prüfen einen Kostenbetrag. +, -, * und / rechnen. === vergleicht ohne eine automatische Umwandlung unterschiedlicher Typen. if führt einen Block aus, wenn die Bedingung zutrifft. Ein else behandelt den anderen Fall.

Beispieldateien

01Strikt vergleichen

0 === "0" ist false, weil Zahl und Text verschiedene Typen haben. == würde hier umwandeln. Gerade Formulare liefern oft Text. Wir wollen eine Umwandlung bewusst vornehmen, statt sie im Vergleich zu verstecken.

conditions.mjs · javascriptDatei öffnen
const costCents = 12990;
if (costCents < 0) {
  console.log('Invalid cost');
} else if (costCents === 0) {
  console.log('Free repair');
} else {
  console.log('Paid repair');
}

Starten / prüfen

node conditions.mjs

02Die Fachregel formulieren

Ein negativer Betrag ist in diesem Beispiel ungültig. 0 bedeutet kostenlos. Alle positiven Beträge sind kostenpflichtig. Die Reihenfolge vermeidet, dass ein allgemeiner Fall einen spezielleren verschluckt.

03Bedingungen verbinden

&& verlangt zwei wahre Bedingungen. || akzeptiert eine wahre Bedingung. ! kehrt einen booleschen Wert um. Teste costCents >= 0 && costCents <= 50000, um einen zulässigen Bereich auszudrücken.

Erwartetes Ergebnis

Bei 12990: Paid repair

Deine Übung

Ändere den Wert nacheinander auf -1, 0 und "0". Erkläre jeden Zweig.

Lösung mit Erklärung anzeigen

-1 ist ungültig, 0 kostenlos. Der Text "0" trifft bei === nicht auf die Zahl 0 und landet hier im letzten Zweig. Das Beispiel zeigt, warum Daten vor der fachlichen Prüfung einen verlässlichen Typ benötigen.

Projektbezug und Quellen

Das Beispiel ist zum Lernen vereinfacht. Die verlinkte Codeversion zeigt die Anwendung im Projekt und die dortigen Prüfungen.