Seite wählen
Anzeige
robhost-banner

Schleifen und Bedingungen in JavaScript

Hier erfahrt ihr etwas über die Möglichkeiten von Schleifen und Verzweigungen (Bedingungen) in JavaScript.

Schleifen:

Mit Schleifen kann man eine beliebige Befehlsfolge mehrmals wiederholen. Wenn schon vorher feststeht, wie oft eine Schleife durchlaufen werden muss, benutzt man meist die for – Schleife. Ansonsten nimmt man eine while – Schleife.

Die Syntax der while – Schleife erlaubt es aber auch, Schleifen wie eine for-Schleife zu programmieren. Deshalb benutzen manche Programmierer nur diesen einen Schleifentyp.

Hier die Syntax:

  1.  while(Abbruchbedingung) {
  2.   //Schleifenkörper (wird solange wiederholt, bis die Abbruchbedingung erreicht ist.
  3.  }

Für Abbruchbedingung könnte man z.B. 123 > a, wobei die Variable a immer um eins inkrementiert (erhöht) werden müsste.

Beispiel:

  1.  while (123>a) {
  2.  document.write(a);
  3.  a++;
  4.  }

Hier würde die Schleife, vorausgesetzt a ist vorher deklariert worden, solange durchlaufen wie a kleiner als 123 ist. Bei jedem Durchlauf wird a einmal in das Browserfenster geschrieben. Am Ende wird a um eins erhöht (mit einem der besonderen Operatoren von JavaScript).

Die gleiche Schleife könnte man auch programmieren, indem man eine do-while – Schleife benutzt.

Beispiel:

  1.  do {
  2.  //auszuführender Code
  3.  } while(Abbruchbedingung);

Der einzige Unterschied bestände dann darin, dass die do-while – Schleife auf jeden Fall einmal durchlaufen wird, auch wenn a schon größer als 123 wäre. Die while – Schleife durchläuft den Code – Block aber nur, wenn die Bedingung zum Abbrechen auch wirklich wahr ist.

Das gleiche kann man auch noch auf eine dritte Weise realisieren. Die for – Schleifen, die komplizierteste der drei Schleifentypen: Bei dieser kann man im Kopf nicht nur die Abbruchbedingung angeben, sondern auch gleichzeitig nur in dieser Schleife gültige Variablen deklarieren und diese auch inkrementieren.

Beispiel:

  1.  for (Deklaration; Abbruchbedingung; neue Wertzuweisung ) {
  2.  //auszuführender Code
  3.  }

 

  1.  for (a=1; 123>a; a++){
  2.  document.write(a);
  3.  }

Hier wird genau das Gleiche getan wie in der obigen while – Schleife.

Es gibt noch eine besondere for-Schleifenart: Die for-in-Schleife:

  1.  var Ausgabe = „“;
  2.  for (var Eigenschaft in document){
  3.  Ausgabe = Ausgabe + „document.„ + Eigenschaft + „: „ + document[Eigenschaft] + „<br>„;
  4.  document.write(„Eigenschaften des Objekts <i>document</i>„)
  5.  document.write(Ausgabe);
  6.  var Ausgabe = „“;
  7.  }

Diese Code-Sequenz gibt verschiedenste Eigenschaften des Browsers über JavaScript in seinem Fenster aus (document ist der Name für das Objekt in JavaScript, das das aktuelle HTML-Dokument darstellt). Ich habe die einzelnen Programmzeilen nummeriert, um jetzt genauer auf sie einzugehen:

  1. Hier wird die Variable Ausgabe deklariert und auf leer gesetzt
  2. Die for-Schleife beginnt: In den Klammern wird eine lokale Variable Eigenschaft deklariert und ihr gesagt, dass sie alle Eigenschaften von document (dem Browser) darstellen soll. Um das wirklich zu verstehen, sollte man sich mit objektorientierter Programmierung in JavaScript auskennen.
  3. Der Variablen Ausgabe wird der Text „document.“ zugewiesen, damit auch ausgegeben wird, um welches Objekt es sich handelt, das die Eigenschaften repräsentieren. Dazu wird der Name der aktuellen Eigenschaft mit dem oben genannten Text verknüpft. Dann wird ein Doppelpunkt angehängt und der Wert dieser Eigenschaft dazugeschrieben. Nun wird noch ein Zeilenumbruch dazugespeichert.
  4. Jetzt wird das ganze Gebilde in das Browserfenster geschrieben (mit HTML-Tags).
  5. In der letzten Zeile wird schließlich das soeben in der Variablen Ausgabe Abgespeicherte ausgegeben.

Diese Schleife muss man nicht zwangsmäßig benutzen (man kann sie auch mit einer Kombination der anderen Schleifentypen erreichen), weshalb man sich keine Sorgen machen braucht, wenn man sie nicht sofort versteht, zumal ich nicht gerade gut erklären kann :-). Trotzdem hier noch einmal die allgemeine Syntax:

  1.  for (Variable in Objekt){
  2.  Anweisung;
  3.  }

Noch einmal konkret formuliert: Diese Anweisung durchläuft jede Eigenschaft des angegebenen Objekts und führt für jede ein und dieselbe Anweisung aus (obe z.B. das Ausgeben). Dabei muss zusätzlich beachtet werden, dass nicht immer alle Eigenschaften von vordefinierten Objekten durchlaufen werden, weil diese Objekte oftmals ihre Eigenschaften verstecken. An dieser Stelle möchte ich die Schlüsselwörter break und continue erwähnen, mit denen man die Ausführung einer Schleife noch weiter beeinflussen kann.

Mit continue kann eine Schleife vorzeitig beendet und wieder von vorne begonnen werden.

Beispiel:

  1.  var a=5;
  2.  while (13>a){
  3.  if (a==5){
  4.  a++;
  5.  continue;
  6.  }
  7.  a++;
  8.  }

Break verwendet man nun ganz genauso, nur das die Schleife ganz abgebrochen und nicht weiter durchlaufen wird.

Verzweigungen:

Verzweigungen sin etwas sehr wichtiges in der Programmierung, so auch bei JavaScript. Mit ihnen kann man Code-Teile, die nur unter bestimmten Bedingungen ausgeführt werden sollen, realisieren. Es gibt zwei sehr verschiedene Arten von solchen Kontrollstukturen. Die erste Art ist die if-Struktur. Man kann sie am besten verstehen, wenn man sich ihre deutsche Übersetzung anschaut: wenn. Bei dieser Verzweigung wird einfach der Code in dem Anweisungsblock nach der if-Klausel ausgeführt. Ein Beispiel sieht man schon bei der Besprechung von continue und break.
Hier nochmal die allgemeine Form:

  1.  if (Bedingung){
  2.  //Anweisungen
  3.  }

Man kann diese Struktur auch noch ausweiten, indem man verschiedene Zweige oder/und einen Default – Wert angibt:

  1.  if (Bedingung) {
  2.  // Anweisungen (wenn)
  3.  }
  4.  else if {
  5.  // Anweisungen (sonst wenn)
  6.  }
  7.  else {
  8.  //Anweisungen (sonst)
  9.  }

Zusätzlich gibt es noch eine spezielle, kürzere Syntax:

  1.  Bedingung ? Dann : Sonst;

Mit dieser kann man z.B. Variablen dynamisch Werte zuteilen.
Beispiel:

  1.  var Ergebnis = (document.Formular.Eingabe.value == „42„) ? „RICHTIG!„ : „FALSCH!„;

Hier wird der Variablen Ergebnis „RICHTIG“ zugewiesen, wenn in dem Formulareinabefeld document.Formular.Eingabe eine 42 steht, sonst enthält die Variable nach dieser Prüfung den Wert „FALSCH“.

Die zweite Form der Verzweigungen ist die switch-Struktur. Mit ihr kann man verschiedene Fälle abfragen. Die Syntax lautet:

  1.  switch (Variable) {
  2.  case „ersterWert„: Anweisungen;
  3.  break;
  4.  case „zweiterWert„: Anweisungen;
  5.  break;
  6.  //… default: Anweisungen;
  7.  }

Dadurch kann man auf einfache Weise verschiedenste Werte einer Variablen abfragen und für jeden Wert eine andere Anweisung ausführen. Das break hinter den Anweisungen der einzelnen „Fälle“ (Übersetzung von case) ist nötig, weil JavaScript standardmäßig einfach munter weiterübersetzt, auch wenn der wahre case-Zweig schon längst vorüber ist (was allerdings manchmal recht praktisch ist, z.B. wenn man für mehrere Werte ein und dieselbe Anweisung ausführen will). Alles was hinter default steht wird ausgeführt, wenn keiner der vorherigen Fälle zutrifft (Eine default-Anweisung ist optional).