JavaScript (Kontrollstrukturen, If-Anweisung, else-Anweisung)


Kontrollstrukturen

Um einen Programmablauf zu steuern, benötigen wir sogenannte Kontrollstrukturen. Eine Kontrollstruktur überprüft eine Bedingung und führt eine Anweisung aus, wenn die Bedingung erfüllt ist. Es gibt Fallunterscheidungen und Schleifen. Fallunterscheidungen arbeiten nach dem Prinzip Wenn A, dann führe B aus, Schleifen wiederholen eine Anweisung so lange, wie die Bedingung erfüllt ist.

if-Anweisung

Die wichtigste Fallunterscheidung ist die if-Anweisung. Sie überprüft, ob eine Bedingung erfüllt ist, und führt entsprechend danach eine festgelegte Anweisung aus. Die Syntax lautet allgemein:

if (Bedingung) {
  Anweisung;
}

Nachfolgend ein Beispiel, in dem der Nutzer sein Alter eingeben soll. Eine einfache einzeilige Eingabe realisieren wir mit dem JavaScript-Befehl prompt. Dieser enthält zwei Parameter in runden Klammern. Zuerst einen Text, der in einer Eingabeaufforderung vorgegeben wird. Bei diesem Beispiel geben machen wir keine Vorgabe. Der Standardwert ist also ein leerer String mit "".

var alter = prompt("Geben Sie bitte Ihr Alter in Jahren ein", "");

Als Nächstes erstellen wir eine if-Anweisung, die überprüft, ob der Nutzer älter als 40 Jahre ist. Entsprechend steuern wir die Ausgabe.

if (alter > 40) {
  document.write("Sie sind kein Teenager mehr");
}

Zuerst wird in der Bedingung geprüft, ob die Variable alter größer als 40 ist. Ist dies der Fall, wird der entsprechende Text im Dokument ausgegeben.

else-Anweisung

Was passiert aber, wenn ein Nutzer jünger als 40 Jahre ist? Nichts, da dieser Fall nicht vorgesehen ist. Eine Möglichkeit diesen Fall abzudecken, wäre eine zweite if-Anweisung. Da müsste allerdings noch eine Bedinung überprüft werden. Einfacher geht es mit der else-Anweisung. Diese übernimmt alle Fälle, bei denen unsere Bedingung der if-Anweisung nicht zutreffen. Die allgemeine Syntax lautet:

if (Bedingung) {
  Anweisung;
} else {
  Anweisung;
}

Für unser Beispiel fügen wir also nur noch die else-Anweisung hinzu.

if (alter > 40) {
  document.write("Sie sind kein Teenager mehr");
} else {
  document.write("Sie gehören noch nicht zum alten Eisen");
}

else if

Mit if und else können wir nun schon zwei Fälle in einer Fallunterscheidung berücksichtigen. Mit else if haben wir die Möglichkeit, beliebige weitere Fälle mit eigenen Bedingungen zu prüfen. Die allgemeine Syntax lautet:

if (Bedingung) {
  Anweisung;
} else if (Bedingung) {
  Anweisung;
} else {
  Anweisung;
}

Kurzschreibweise

Wenn wir eine if-else-Anweisung mit jeweils nur einer Anweisung schreiben, können wir uns die geschweiften Klammern sparen und alles in eine Zeile packen. Die allgemeine Syntax lautet:

if (Bedingung) Anweisung; else Anweisung;

Sinnvoll ist diese Schreibweise aus Gründen der Übersichtlichkeit natürlich nur bei kurzen Anweisungen. Zum Beispiel wie folgt:

if (a > 5) b = 3; else b = 10;

Zuerst wird überprüft ob a größer als 5 ist. Wenn dies zutrifft, wird b auf 3 gesetzt, ansonsten auf 10.

switch-Anweisung

Die switch-Anweisung ist die zweite Fallunterscheidung in JavaScript. Diese überprüft für eine Variable unterschiedliche Werte. Damit können wir ohne viel Codeaufwand viele Bedingungen überprüfen. Die allgemeine Syntax lautet:

switch (Variable) {
  case Wert1:
    Anweisung;
    break;
  case Wert2:
    Anweisung;
    break;
  default:
    Anweisung;
}

Dazu ein kleines Beispiel:

var aufgabe = prompt("Bitte geben Sie Ihr Geschlecht an. 1 für männlich, 2 für weiblich", "");
var geschlecht ="";
var text;
aufgabe = parseInt(aufgabe);
switch (aufgabe) {
  case 1:
    geschlecht = "männlich";
    break;
  case 2:
    geschlecht = "weiblich";
    break;
  default:
    geschlecht= "beides";
}
alert("Sie sind " + geschlecht);

Im obigen Beispiel wird der Nutzer zuerst aufgefordert sein Geschlecht mit 1 oder 2 anzugeben. Da es sich bei dieser Eingabe um eine Zeichenkette handelt, muss sie mit parseInt() in eine numerische Variable (Integer) umgewandelt werden. Eine weitere Variable namens geschlecht wird deklariert. Ihr soll später die Bezeichnung männlich, weiblich oder beides zu kommen. In der switch-Anweisung wird die Variable aufgabe geprüft. Trifft einer der Werte zu, so wird die Variable geschlecht entsprechend gesetzt. Mit dem JavaScript-Befehl break wird die Anweisung verlassen und die weiteren Werte werden nicht mehr getestet. Nach der switch-Anweisung wird die Variable geschlecht mit kurzem Begleittext ausgegeben.

<< Vergleichsoperatoren
>> JavaScript-Schleifen

W3C Validator | W3C CSS-Validator