JavaScript - Control Flow

In JS ist das if-else Konstrukt das gleiche wie in vielen anderen Sprachen

if (/* Condition */) {
 
} else if (/* Condition */) {
  // Es können weitere else-if cases hinzugefügt werden
} else {
  // "Everything else"
}

Die Conditionals müssen natürlich einem wahren oder falschen Wert (Boolean) entsprechen.

Hier kommt nun zum ersten mal einer der Features von JS zu tragen, die manchmal zu skurillen Ergebnissen führt: Implicit Type Conversion

In bestimmten Fällen erwartet JavaScript einen bestimmten Datentyp. Wird ein anderer Datentyp angefunden, so versucht JavaScript den Wert in den benötigten Datentyp zu konvertieren ohne dass der Entwickler explizit eine Konversion durchführen muss.

Die Konversion geschieht nahtlos zwischen verschiedenen Typen

let num = 5;
if (num) {
  console.log('Num ist true!');
}
num = 0;
if (num) {
  console.log('Num ist immernoch true?');
} else {
  console.log('Num ist false!');
}
let num = 5;
if (num) {
  console.log('Num ist true!');
}
num = 0;
if (num) {
  console.log('Num ist immernoch true?');
} else {
  console.log('Num ist false!');
}
let num = 5;
if (num) {
  console.log('Num ist true!');
}
num = 0;
if (num) {
  console.log('Num ist immernoch true?');
} else {
  console.log('Num ist false!');
}

Im Fall einer Boolean-Conversion sprechen wir darüber, ob ein Wert/Datentyp einen truthy oder falsy Wert hat.

Falsy Werte

• null
• undefined
• false
• NaN
• Die Zahl "0"
• Leerer String

Wir können eine Variable "explizit" zu einem Boolean konvertieren, indem wir ein doppeltes Ausrufezeichen ( !! ) vor die Variable stellen

let num = 5;
const isTruthyNum = !!num;

Ein einfaches Ausrufezeichen konvertiert den Wert auch in ein Boolean, führt aber eine Not-Operation aus. (Im Grunde wenden wir ein Not-Not mit dem doppelten Ausrufezeichen an)

Werte miteinander Vergleichen

Eine weitere Besonderheit in JS: Es gibt 2 "Arten" um eine Gleicheit festzustellen.

Hierfür gibt es den "einfach" Vergleichsoperator == und einen sicheren Vergleichsoperator ===

Der Unterschied zwischen == & === liegt darin, dass beim einfachen Vergleich, JavaScript unter Umständen den Datentypen konvertiert um Gleichheit zu testen.

Ein Beispiel

const theAnswer = 42;
if ("42" == theAnswer) {
  console.log('Yay');
}
if ("42" === theAnswer) {
  // Wird nicht gelogged
  console.log('No Yay');
}

Der Richtige Ansatz hierbei ist: Verwenden sie den Typ-Sicheren Vergleichsoperator "==="

Weitere Vergleichsoperationen

• > & >= [greater than (or equal)]
• < & <= [less than (or equal)]
• !== [Strict Inequality]

Es können mehrere Vergleiche durchgeführt werden und mit UND / ODER verknüpft werden:

• || (ODER)
• && (UND)

Auch in JavaScript haben wir die Möglichkeit mehrere Möglichkeiten einer Variable abzufragen.

const num = 42;
switch (num) {
  case 1:
    break;
  case 42: 
    // Code hier wird ausgeführt
    break;
  default:
    // Falls kein 'case' matched
}

Es gibt leider keine Möglichkeit Funktionsaufrufe zum testen zu machen, hierfür müssen andere Optionen in Erwägung gezogen werden.

Alle bekannten Schleifen die man wahrscheinlich aus anderen Programmiersprachen kennt, gibt es auch in JS

• while
• do-while
• for

Die Syntax ist auch der zu C oder Java sehr ähnlich / gleich

// Kopfgesteuert
while (/* Condition */) { /* Code to Execute */ }
 
// Fußgesteuert
do { /* Code to Execute */} (/* Condition */)
 
// Zählschleife
// for (init; condition; "afterthought")
for (let i = 0; i < 5; i++) {
  /* Code to Execute */
}

Eine Realität aus meiner Sicht als Webentwickler:

Ich verwende Schleifen in dieser Form nur noch sehr selten.

Wenn wir mit Arrays und dergleichen Arbeiten, gibt es bereits eine Menge an "Convenience"-Features, die wir verwenden können um über alle Inhalte eines Arrays zu iterrieren / manipulieren / testen.