JavaScript
Bedingungen

Einführung

Syntax

• if ( Bedingung ) Anweisung ;
• if ( Bedingung ) Anweisung_1 , Anweisung_2 , ... , Anweisung_n ;
• if ( Bedingung ) {
  Aussage
  }
• if ( Bedingung ) {
  Anweisung_1 ;
  Anweisung_2 ;
  ...
  statement_n ;
  }
• if ( Bedingung ) {
  Aussage
  } else {
  Aussage
  }
• if ( Bedingung ) {
  Aussage
  } else if ( Bedingung ) {
  Aussage
  } else {
  Aussage
  }
• switch ( Ausdruck ) {
  Fallwert1 :
  Aussage
  [brechen;]
  Fallwert2 :
  Aussage
  [brechen;]
  FallwertN :
  Aussage
  [brechen;]
  Standard:
  Aussage
  [brechen;]
  }
• Bedingung value_for_true : value_for_false ;

Bemerkungen

If / Else If / Else Kontrolle

In seiner einfachsten Form kann eine if Bedingung folgendermaßen verwendet werden:

var i = 0;

if (i < 1) {
    console.log("i is smaller than 1");
}

Die Bedingung i < 1 wird ausgewertet, und wenn sie als true ausgewertet wird, wird der folgende Block ausgeführt. Wenn der Wert false , wird der Block übersprungen.

Eine if Bedingung kann mit einem else Block erweitert werden. Die Bedingung wird wie oben einmal geprüft, und wenn sie als false bewertet wird, wird ein sekundärer Block ausgeführt (der bei true Bedingung übersprungen würde). Ein Beispiel:

if (i < 1) {
    console.log("i is smaller than 1");
} else {
    console.log("i was not smaller than 1");
}

Angenommen, der else Block enthält nur einen anderen if Block (optional mit einem else Block):

if (i < 1) {
    console.log("i is smaller than 1");
} else {
    if (i < 2) {
        console.log("i is smaller than 2");
    } else {
        console.log("none of the previous conditions was true");
    }
}

Dann gibt es auch eine andere Schreibweise, um das Verschachteln zu reduzieren:

if (i < 1) {
    console.log("i is smaller than 1");
} else if (i < 2) {
    console.log("i is smaller than 2");
} else {
    console.log("none of the previous conditions was true");
}

Einige wichtige Fußnoten zu den obigen Beispielen:

• Wenn eine Bedingung als true bewertet wird, wird keine andere Bedingung in dieser Kette von Blöcken ausgewertet, und alle entsprechenden Blöcke (einschließlich des else Blocks) werden nicht ausgeführt.

• Die Anzahl else if Teile ist praktisch unbegrenzt. Das letzte Beispiel oben enthält nur eine, Sie können aber beliebig viele davon haben.

• Die Bedingung in einer if -Anweisung kann alles sein, was zu einem booleschen Wert erzwungen werden kann. Weitere Informationen finden Sie im Thema zur booleschen Logik .

• Die if-else-if Ladder wird beim ersten Erfolg beendet. Das heißt, wenn im obigen Beispiel der Wert von i 0,5 ist, wird der erste Zweig ausgeführt. Wenn sich die Bedingungen überschneiden, werden die ersten im Ausführungsablauf auftretenden Kriterien ausgeführt. Die andere Bedingung, die auch wahr sein könnte, wird ignoriert.

• Wenn Sie nur eine Anweisung haben, sind die Klammern um diese Aussage technisch optional, z. B. ist dies in Ordnung:

  if (i < 1) console.log("i is smaller than 1");
  

  Und das wird auch funktionieren:

  if (i < 1) 
      console.log("i is smaller than 1");
  

  Wenn Sie mehrere Anweisungen innerhalb eines if Blocks ausführen möchten, sind die geschweiften Klammern obligatorisch. Nur die Verwendung von Einrückungen reicht nicht aus. Zum Beispiel den folgenden Code:

  if (i < 1) 
      console.log("i is smaller than 1");
      console.log("this will run REGARDLESS of the condition"); // Warning, see text!
  

  ist äquivalent zu:

  if (i < 1) {
      console.log("i is smaller than 1");
  }
  console.log("this will run REGARDLESS of the condition");
  

Anweisung wechseln

Switch-Anweisungen vergleichen den Wert eines Ausdrucks mit einem oder mehreren Werten und führen basierend auf diesem Vergleich verschiedene Codeabschnitte aus.

var value = 1;
switch (value) {
  case 1:
    console.log('I will always run');
    break;
  case 2:
    console.log('I will never run');
    break;
}

Die break Anweisung "bricht" die switch-Anweisung aus und stellt sicher, dass kein Code mehr in der switch-Anweisung ausgeführt wird. Auf diese Weise werden Abschnitte definiert, und der Benutzer kann Fälle "durchfallen".

Achtung : Das Fehlen einer break oder return Anweisung für jeden Fall bedeutet, dass das Programm den nächsten Fall weiter auswertet, auch wenn die Kriterien nicht erfüllt sind!

switch (value) {
  case 1:
    console.log('I will only run if value === 1');
    // Here, the code "falls through" and will run the code under case 2
  case 2:
    console.log('I will run if value === 1 or value === 2');
    break;
  case 3:
    console.log('I will only run if value === 3');
    break;
}

Der letzte Fall ist der default . Dieser wird ausgeführt, wenn keine anderen Übereinstimmungen gemacht wurden.

var animal = 'Lion';
switch (animal) {
  case 'Dog':
    console.log('I will not run since animal !== "Dog"');
    break;
  case 'Cat':
    console.log('I will not run since animal !== "Cat"');
    break;
  default:
    console.log('I will run since animal does not match any other case');
}

Es sollte beachtet werden, dass ein case-Ausdruck jede Art von Ausdruck sein kann. Das heißt, Sie können Vergleiche, Funktionsaufrufe usw. als Fallwerte verwenden.

function john() {
  return 'John';
}

function jacob() {
  return 'Jacob';
}

switch (name) {
  case john(): // Compare name with the return value of john() (name == "John")
    console.log('I will run if name === "John"');
    break;
  case 'Ja' + 'ne': // Concatenate the strings together then compare (name == "Jane")
    console.log('I will run if name === "Jane"');
    break;
  case john() + ' ' + jacob() + ' Jingleheimer Schmidt':
    console.log('His name is equal to name too!');
    break;
}

Multiple Inclusive-Kriterien für Fälle

Da Fälle ohne eine break oder return Anweisung "durchfallen", können Sie dies zum Erstellen mehrerer inklusiver Kriterien verwenden:

var x = "c"
switch (x) {
   case "a":
   case "b":
   case "c":
      console.log("Either a, b, or c was selected.");
      break;
   case "d":
      console.log("Only d was selected.");
      break;
   default:
      console.log("No case was matched.");
      break;  // precautionary break if case order changes
}

Ternäre Betreiber

Kann verwendet werden, um if / else-Operationen zu verkürzen. Dies ist praktisch, um einen Wert schnell zurückzugeben (dh um ihn einer anderen Variablen zuzuordnen).

Zum Beispiel:

var animal = 'kitty';
var result = (animal === 'kitty') ? 'cute' : 'still nice';

In diesem Fall erhält das result den 'niedlichen' Wert, da der Wert des Tieres 'kitty' ist. Wenn das Tier einen anderen Wert hätte, würde das Ergebnis den "noch schönen" Wert erhalten.

Vergleichen Sie dies mit dem, was der Code mit if/else Bedingungen möchte.

var animal = 'kitty';
var result = '';
if (animal === 'kitty') {
    result = 'cute';
} else {
    result = 'still nice';
}

Die if oder else Bedingungen können mehrere Operationen haben. In diesem Fall gibt der Operator das Ergebnis des letzten Ausdrucks zurück.

var a = 0;
var str = 'not a';
var b = '';
b = a === 0 ? (a = 1, str += ' test') : (a = 2);

Da a gleich 0 war, wird es 1 , und str wird "kein Test". Die Operation, an der str war, war die letzte, daher erhält b das Ergebnis der Operation. Dies ist der in str enthaltene Wert, dh 'kein Test'.

Ternäre Operatoren erwarten immer andere Bedingungen, andernfalls erhalten Sie einen Syntaxfehler. Als Problemumgehung könnten Sie eine Null zurückgeben, ähnlich wie im Zweig else. Dies ist nicht wichtig, wenn Sie den Rückgabewert nicht verwenden, sondern nur den Vorgang verkürzen (oder versuchen, ihn zu verkürzen).

var a = 1;
a === 1 ? alert('Hey, it is 1!') : 0;

Wie Sie sehen, if (a === 1) alert('Hey, it is 1!'); würde das Gleiche tun. Es wäre nur ein Zeichen länger, da es keine zwingende else Bedingung braucht. Wenn eine else Bedingung vorliegt, wäre die ternäre Methode wesentlich sauberer.

a === 1 ? alert('Hey, it is 1!') : alert('Weird, what could it be?');
if (a === 1) alert('Hey, it is 1!') else alert('Weird, what could it be?');

Ternare können verschachtelt werden, um zusätzliche Logik einzukapseln. Zum Beispiel

foo ? bar ? 1 : 2 : 3

// To be clear, this is evaluated left to right 
// and can be more explicitly expressed as:

foo ? (bar ? 1 : 2) : 3

Dies ist das gleiche wie das folgende if/else

if (foo) {
  if (bar) {
    1
  } else {
    2
  }
} else {
  3
}

Stilistisch sollte dies nur für kurze Variablennamen verwendet werden, da mehrzeilige Ternare die Lesbarkeit drastisch beeinträchtigen können.

Die einzigen Anweisungen, die nicht in Ternaren verwendet werden können, sind Steueranweisungen. Sie können beispielsweise keine Rückgabe- oder Abbruchpfade mit Ternaren verwenden. Der folgende Ausdruck ist ungültig.

var animal = 'kitty';
for (var i = 0; i < 5; ++i) {
    (animal === 'kitty') ? break:console.log(i);
}

Für return-Anweisungen wäre Folgendes ebenfalls ungültig:

var animal = 'kitty';
(animal === 'kitty') ? return 'meow' : return 'woof';

Um dies ordnungsgemäß auszuführen, geben Sie das Ternary wie folgt zurück:

var animal = 'kitty';
return (animal === 'kitty') ? 'meow' : 'woof';

Strategie

In JavaScript kann in vielen Fällen ein Strategiemuster verwendet werden, um eine switch-Anweisung zu ersetzen. Dies ist besonders hilfreich, wenn die Anzahl der Bedingungen dynamisch oder sehr groß ist. Dadurch kann der Code für jede Bedingung unabhängig und separat testbar sein.

Ein Strategieobjekt ist ein einfaches Objekt mit mehreren Funktionen, die jede einzelne Bedingung darstellen. Beispiel:

const AnimalSays = {
    dog () {
        return 'woof';
    },

    cat () {
        return 'meow';
    },

    lion () {
        return 'roar';
    },

    // ... other animals

    default () {
        return 'moo';
    }
};

Das obige Objekt kann wie folgt verwendet werden:

function makeAnimalSpeak (animal) {
    // Match the animal by type
    const speak = AnimalSays[animal] || AnimalSays.default;
    console.log(animal + ' says ' + speak());
}

Ergebnisse:

makeAnimalSpeak('dog') // => 'dog says woof'
makeAnimalSpeak('cat') // => 'cat says meow'
makeAnimalSpeak('lion') // => 'lion says roar'
makeAnimalSpeak('snake') // => 'snake says moo'

Im letzten Fall behandelt unsere Standardfunktion alle fehlenden Tiere.

Verwenden von || und && kurzschließen

Die booleschen Operatoren || und && "kurzschließen" und den zweiten Parameter nicht auswerten, wenn der erste wahr oder falsch ist Damit können kurze Bedingungen wie folgt geschrieben werden:

var x = 10

x == 10 && alert("x is 10")
x == 10 || alert("x is not 10")