1. Funktionen
  2. Bedingte Anweisungen und Schleifen




1. Funktionen



Mit Hilfe von Funktionen kann man eigene, in sich abgeschlossene JavaScript-Prozeduren programmieren, die dann über den Aufruf der Funktion ausgeführt werden können. JavaScript-Code, der nicht innerhalb einer Funktion steht, wird beim Einlesen der Datei vom WWW-Browser sofort ausgeführt! Der in einer Funktion enthaltene Code wird nur an den Stellen ausgeführt, an denen die jeweilige Funktion anhand ihres Funktionsnamens aufgerufen wird. Dies kann zum Beispiel ein Ereignis wie das Klicken eines Buttons durch den Anwender sein. Man ist in der Lage ein häufig auftretendes Problem durch die Programmierung einer Funktion zu lösen und diese immer wieder aufzurufen, wenn sie benötigt wird.

Mit dem Schlüsselwort "function" wird die Definition einer Funktion eingeleitet. Dahinter folgt, durch ein Leerzeichen getrennt, der Funktionsname. Unmittelbar hinter dem Funktionsnamen folgt in Klammern die Übergabe der Parameter. Mehrere Parameter werden durch Kommata voneinander getrennt. Parameter, die an eine Funktion übergeben werden sollen, müssen immer beim Aufruf der Funktion in Klammern mit übergeben werden. Eine Angabe von Parametern ist allerdings nicht zwingend erforderlich, es werden einfach leere Klammern notiert. Der gesamte Inhalt der Funktion wird in geschweifte Klammern { und } eingeschlossen. Diese Klammern dürfen niemals fehlen! Die Anweisungen innerhalb der Funktion können sehr unterschiedlicher Natur sein. Da können Sie z.B. Objekte manipulieren, übergebene Parameter verarbeiten und ändern, Berechnungen anstellen usw. Man kann innerhalb von Funktionen auch andere Funktionen aufrufen. Welche Anweisungen innerhalb einer Funktion stehen, hängt davon ab, was die Funktion leisten soll.

- allgemeine Syntax mit Parameterübergabe:

function Funktionsname(Parameter1, Parameter2, ...)
{Funktionsblock}

- allgemeine Syntax ohne Parameterübergabe:

function Funktionsname()
{Funktionsblock}

Beispiel: <html>
<head>
<title>Hallo Welt!</title>
<script type="text/javascript">
<!--
function Ausgabe(text)
{
alert(text);
}
//-->
</script>
</head>
<body>
<form name="Eingabe" action="">
Geben Sie einen Text ein
<input type="text" name="Eingabetext">
<input type="button" value="Text anzeigen" onClick="Ausgabe(document.Eingabe.Eingabetext.value)">
</form> </body></html>

ansehen

Im "head"-Abschnitt des html-Dokumentes wird die Funktion mit dem Namen Ausgabe definiert. Es soll der Parameter namens text übergeben werden. Innerhalb der Funktion wird angewiesen, dass der Parameter in einem Meldefenster angezeigt wird. Im "body"-Teil des html-Dokumentes wird ein Formular mit einem Eingabefeld und einem Button definiert. Beim Klicken des Buttons wird die Funktion Ausgabe aufgerufen. Der zu übergebende Parameter ist der Wert des Eingabefeldes.

Durch das reservierte Wort return hat man die Möglichkeit, einen Wert zurückzugeben. Genauer gesagt bricht return die Bearbeitung einer Funktion sofort ab.

Beispiel: function sqr(x)
{
var y=x*x;
return y;
}

Im Beispiel wird das Quadrat des übergebenden Parameters berechnet.

Funktionen kann man entweder selbst definieren oder man benutzt vordefinierte JavaScript - Funktionen.

Selbst definierte Funktionen

Eigene Funktionen können innerhalb eines JavaScript-Bereichs oder in einer separaten JavaScript-Datei definiert werden. An erlaubten Stellen, z.B. innerhalb der einleitenden HTML-Tags <body...> und <a href...>, oder in einem Formular-Tag wie <input...>, können Sie eine solche selbst definierte Funktion dann mit Hilfe eines Event-Handlers aufrufen. Oder Sie rufen eine Funktion innerhalb einer anderen Funktion auf.

Der Funktionsname ist frei wählbar. Dabei sind die Regeln für selbst vergebene Namen zu beachten. Am Besten, man vergibt einen Funktionsnamen, der das, was die Funktion leistet, ungefähr beschreibt. Hinter dem Funktionsnamen steht eine geöffnete Klammer. Wenn die Funktion keine Parameter erwarten soll, notiert man dahinter sofort wieder eine schließende Klammer. Wenn die Funktion Parameter übergeben bekommen soll, notiert man innerhalb der Klammer die Namen der Parameter. Die Namen der Parameter sind frei wählbar. Bei den Parameternamen gelten die gleichen Regeln wie beim Funktionsnamen.

Vordefinierte JavaScript-Funktionen

Es gibt ein paar Funktionen, die bereits in JavaScript integriert sind. Solche Funktionen können Sie aufrufen, ohne sie selbst zu definieren. Die meisten vordefinierten Funktionen gehören zu Objekten, es gibt jedoch auch einige Funktionen, die zu keinem vorhandenen Objekt so richtig passen.

Name Bedeutung Beispiel

eval(Zeichenkette) Ein "Interpreter im Interpreter", hauptsächlich für Berechnungen. Er Interpretiert die Zeichenkette als JavaScript-Befehlsfolge und gibt ein eventuelles Ergebnis zurück. Erzeugt eine Fehlermeldung, wenn der übergebene Ausdruck nicht interpretierbar ist. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="1+2+3+4+5+6+7+8+9" name="Eingabe1" readonly>
<input type="button" value="Berechnen" onClick= "alert(eval(this.form.Eingabe1.value))">
<input size="30" value="12.78*5.13" name="Eingabe2" readonly>
<input type="button" value="Berechnen" onClick= "alert(eval(this.form.Eingabe2.value))">
</form> </body></html>

ansehen

Das Beispiel enthält ein Formular mit zwei schreibgeschützten Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zeichenkette "1+2+3+4+5+6+7+8+9" eingegeben, und im zweiten "12.78*5.13". Beim Klick auf den Button werden die Werte aus dem Formular mit eval() berechnet und in einem Meldungsfenster ausgegeben.

parseFloat(Zeichenkette) Eine Zeichenkette wird in eine Gleitkommazahl umgerechnet und das Ergebnis zurückgegeben. Lässt sich der übergebene Wert nicht in eine Zahl umwandeln, liefert die Funktion NaN (not a number). Wenn die Zeichenkette weiter hinten ungültige Zeichen enthält, wird die Zahl bis zum ersten ungültigen Zeichen interpretiert und der interpretierte Teil zurückgegeben. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="12.4" name="Eingabe1" readonly>
<input type="button" value="Anzeigen" onClick= "alert(parseFloat(this.form.Eingabe1.value))">
<input size="30" value="hallo" name="Eingabe2" readonly>
<input type="button" value="Anzeigen" onClick= "alert(parseFloat(this.form.Eingabe2.value))">
<input size="30" value="124error" name="Eingabe3" readonly>
<input type="button" value="Anzeigen" onClick= "alert(parseFloat(this.form.Eingabe3.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit 3 schreibgeschützten Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zeichenkette "12.4" eingegeben, im zweiten "hallo" und im dritten "124error". Beim Klick auf den Button wird der Wert aus dem Formular mit parseFloat() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben.

parseInt(Zeichenkette) Eine Zeichenkette wird in eine ganze Zahl umgerechnet und das Ergebnis zurückgegeben Lässt sich der übergebene Wert nicht in eine Zahl umwandeln, liefert die Funktion NaN (not a number). Wenn die Zeichenkette weiter hinten ungültige Zeichen enthält, wird die Zahl bis zum ersten ungültigen Zeichen interpretiert und der interpretierte Teil zurückgegeben. Das gilt bei parseInt() auch für den Punkt. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="12.4" name="Eingabe1" readonly>
<input type="button" value="Anzeigen" onClick= "alert(parseInt(this.form.Eingabe1.value))">
<input size="30" value="hallo" name="Eingabe2" readonly>
<input type="button" value="Anzeigen" onClick= "alert(parseInt(this.form.Eingabe2.value))">
<input size="30" value="12.4error" name="Eingabe3" readonly>
<input type="button" value="Anzeigen" onClick= "alert(parseInt(this.form.Eingabe3.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit drei schreibgeschützten Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zeichenkette "12.4", im zweiten "hallo" und im dritten "12.4error" eingegeben. Beim Klick auf den Button wird der Wert aus dem Formular mit parseInt() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben.

isNaN(Ausdruck) Überprüft, ob ein Wert eine Zahl ist oder nicht. Ist der Wert keine Zahl, liefert die Funktion true, sonst false. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="12" name="Eingabe1" readonly>
<input type="button" value="Anzeigen" onClick= "alert(isNaN(this.form.Eingabe1.value))">
<input size="30" value="hallo" name="Eingabe2" readonly>
<input type="button" value="Anzeigen" onClick= "alert(isNaN(this.form.Eingabe2.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit zwei Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zahl "12" eingegeben und im zweiten die Zeichenkette "hallo". Beim Klick auf den Button wird der Wert aus dem Formular mit isNaN() überprüft und das Ergebnis in einem Meldungsfenster ausgegeben.

isFinite(Ausdruck) Ermittelt, ob sich ein Wert innerhalb des Zahlenbereichs befindet, den JavaScript verarbeiten kann, also aus Sicht von JavaScript eine gültige Zahl darstellt. Gibt true zurück, wenn der Wert eine gültige Zahl ist, und false, wenn es keine Zahl ist bzw. die Zahl sich außerhalb des Wertebereiches von JavaScript befindet. Sowohl ganze Zahlen als auch Kommazahlen werden als gültige Zahlen erkannt. Bei Kommazahlen muss das Dezimalzeichen ein Punkt sein. <html><head><title<>Test</title>
</head><body>
<form action="">
<input size="30" value="12" name="Eingabe1" readonly>
<input type="button" value="Anzeigen" onClick= "alert(isFinite(this.form.Eingabe1.value))">
<input size="30" value="hallo" name="Eingabe2" readonly>
<input type="button" value="Anzeigen" onClick= "alert(isFinite(this.form.Eingabe2.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit zwei Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zahl "12" eingegeben und im zweiten die Zeichenkette "hallo". Beim Klick auf den Button wird der Wert aus dem Formular mit isFinite() überprüft und das Ergebnis in einem Meldungsfenster ausgegeben.

Number(Ausdruck) Konvertiert den Inhalt eines Objekts in eine Zahl und gibt die Zahl zurück. Erwartet den Objektinhalt als Parameter. Wenn sich der übergebene Parameter nicht als Zahl interpretieren lässt, wird NaN (Not a Number) zurückgegeben. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="12" name="Eingabe1" readonly>
<input type="button" value="Anzeigen" onClick= "alert(Number(this.form.Eingabe1.value))">
<input size="30" value="hallo" name="Eingabe2" readonly>
<input type="button" value="Anzeigen" onClick= "alert(Number(this.form.Eingabe2.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit zwei Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zeichenkette "12" eingegeben und im zweiten "hallo". Beim Klick auf den Button wird der Wert aus dem Formular mit Number() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben. Im Gegensatz zu parseFloat() werden Zahlen mit anderen Zeichen am Ende nicht als Zahlen erkannt.

String(Ausdruck) Erzeugt aus einen beliebigen Ausdruck eine Zeichenkette und gibt diese zurück <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="12" name="Eingabe1" readonly>
<input type="button" value="Zeichenkette erzeugen" onClick= "alert(String(this.form.Eingabe1.value))">
<input size="30" value="hallo" name="Eingabe2" readonly>
<input type="button" value="Zeichenkette erzeugen" onClick= "alert(String(this.form.Eingabe2.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit zwei Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zahl "12" eingegeben und im zweiten die Zeichenkette "hallo". Beim Klick auf den Button wird der Wert aus dem Formular mit String() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben.

escape(Zeichenkette) Wandelt Steuersequenzen (Steuerzeichen mit den ASCII-Werten 0 bis 31) und Sonderzeichen wie z.B. deutsche Umlaute in ihre ASCII-Zahlenwerte um, und zwar in hexadezimaler Form. Setzt vor jeden Wert das Trennzeichen "%" und gibt die so erzeugte Zeichenkette zurück. Bei anderen Zeichen als Steuer- und Sonderzeichen gibt escape() die Zeichen unverändert zurück. Es handelt sich also um eine Funktion, die Steuer- und Sonderzeichen aus Werten entfernt und in Zeichenfolgen übersetzt. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="übung" name="Eingabe1" readonly>
<input type="button" value="Umwandeln" onClick= "alert(escape(this.form.Eingabe1.value))">
<input size="30" value="<html>" name="Eingabe2" readonly>
<input type="button" value="Umwandeln" onClick= "alert(escape(this.form.Eingabe2.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit zwei Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zeichenkette "übung" eingegeben und im zweiten "<html>". Beim Klick auf den Button wird der Wert aus dem Formular mit escape() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben.

Diese Funktion wird in Zukunft durch encodeURI() ersetzt!

unescape(Zeichenkette) Wandelt alle von %-Zeichen angeführten zweistelligen Ziffernfolgen in Zeichen oder Steuerzeichen um und gibt das Ergebnis zurück. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="%FCbung" name="Eingabe1" readonly>
<input type="button" value="Umwandeln" onClick= "alert(unescape(this.form.Eingabe1.value))">
<input size="30" value="%3Chtml%3E" name="Eingabe2" readonly>
<input type="button" value="Umwandeln" onClick= "alert(unescape(this.form.Eingabe2.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit zwei Eingabefeldern und je einem Button. In dem ersten Eingabefeld ist die Zeichenkette "%FCbung" eingegeben und im zweiten "%3Chtml%3E". Beim Klick auf den Button wird der Wert aus dem Formular mit unescape() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben.

Diese Funktion wird in Zukunft durch decodeURI() ersetzt!

encodeURI() Verschlüsselt einen URI so, dass alle Sonderzeichen in ASCII-Zeichensequenzen umgewandelt werden. Besonders wichtig ist dies für Aufrufe von CGI-Scripts mit Parametern. Denn HTML 4.0 verlangt beispielsweise, im href-Attribut von Verweisen encodierte Zeichenketten zu verwenden, sofern die Adressen Sonderzeichen enthalten. Kodiert alle außer den folgenden Zeichen:

A bis Z
a bis z
- _ . ! ~ * ' ( )
, / ? : @ & = + $

Kodiert werden also beispielsweise deutsche Umlaute und Sonderzeichen, auch Leerzeichen, eckige und geschweifte Klammern usw.
<html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="müller@xyz.de" name="Eingabe" readonly>
<input type="button" value="Umwandeln" onClick= "alert(encodeURI(this.form.Eingabe.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit einem Eingabefeld und einem Button. In dem Eingabefeld ist die Zeichenkette (Email-Adresse) "müller@xyz.de" eingegeben. Beim Klick auf den Button wird der Wert aus dem Formular mit encodeURI() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben.

Opera 5.12 interpretiert dieses Methode nicht.

encodeURIComponent() Wie encodeURI(), aber mit dem Unterschied, dass auch folgende Zeichen kodiert werden:

, / ? : @ & = + $

decodeURI() Dekodiert einen URI, der mit encodeURI() kodiert wurde. <html><head><title>Test</title>
</head><body>
<form action="">
<input size="30" value="m%C3%BCller@xyz.de" name="Eingabe" readonly>
<input type="button" value="Umwandeln" onClick= "alert(decodeURI(this.form.Eingabe.value))">
</form>
</body></html>

ansehen

Das Beispiel enthält ein Formular mit einem Eingabefeld und einem Button. In dem Eingabefeld ist die kodierte Zeichenkette (Email-Adresse) "m%C3%BCller@xyz.de" eingegeben. Beim Klick auf den Button wird der Wert aus dem Formular mit decodeURI() umgewandelt und das Ergebnis in einem Meldungsfenster ausgegeben.

Opera 5.12 interpretiert dieses Methode nicht.

decodeURIComponent() Wie decodeURI(). Sollte aber nur auf Adressen oder Adressteile angewendet werden, die mit mit encodeURIComponent() kodiert wurden.
Top



2. Bedingte Anweisungen und Schleifen



Bedingte Anweisungen

- Die if-Anweisung

Mit Hilfe der if-Anweisung kann man eine Wenn-Dann-Bedingung formulieren. Ist eine bestimmte Bedingung erfüllt, wird die Anweisung ausgeführt. Es können auch mehrere Anweisungen formuliert werden.

Eingeleitet wird die if-Anweisung mit dem Schlüsselwort "if" und dahinter folgt in runden Klammern die Bedingung. Ist diese erfüllt, wird die in geschweiften Klammern folgende Anweisung ausgeführt. Ist die Bedingung nicht erfüllt, wird die if-Anweisung ignoriert.

Beispiel: var x = window.prompt("Bitte geben sie eine Zahl ein", "");

if (x == 1)
{
alert("Sie haben die Zahl 1 eingegeben.");
}

Der Benutzer wird mittels "window.prompt" aufgefordert, eine Zahl im Dialogfenster einzugeben. Der Rückgabewert wird in der Variable x gespeichert. Ist diese Zahl eine 1, so wird "Sie haben die Zahl 1 eingegeben." auf dem Bildschirm ausgegeben, ansonsten passiert nichts.

- Die if/else-Anweisung

Die if/else-Anweisung ist die Erweiterung der if-Anweisung. Man spricht auch von einer Entweder-Oder-Bedingung. Ist die mit "if" formulierte Bedingung nicht erfüllt, wird die mit "else" eingeleitete Anweisung ausgeführt. Auch bei "else" können mehrere Anweisungen formuliert werden.

Beispiel: var x = window.prompt("Bitte geben sie eine Zahl ein", "");

if (x == 1)
{
alert("Sie haben die Zahl 1 eingegeben.");
}

else
{
alert("Sie haben nicht die Zahl 1 eingegeben.");
}

Das Beispiel ist die Erweiterung des Beispiels für die if-Anweisung. Gibt der Nutzer die Zahl 1 ein, erscheint wieder "Sie haben die Zahl 1 eingegeben." auf dem Bildschirm. Für den Fall, dass er nicht "1" eingibt, wird die Meldung "Sie haben nicht die Zahl 1 eingegeben." angezeigt.

Es gibt auch eine kürzere Schreibweise für die if/else-Anweisung:

Bedingung ? Anweisung : alternative Anweisung ;

Das oben genannte Beispiel würde dann folgendermaßen lauten:

var x = window.prompt("Bitte geben sie eine Zahl ein", "");

(x == 1) ? alert("Sie haben die Zahl 1 eingegeben.") : alert("Sie haben nicht die Zahl 1 eingegeben.");

- switch-case-default-Fallunterscheidungen

Will man nach mehr als zwei Fällen unterscheiden, eignet sich die switch-case-default-Methode.

Mit "switch" wird die Fallunterscheidung eingeleitet. Dahinter folgt in runden Klammern die Variable oder der Ausdruck, für dessen aktuellen Wert die Fallunterscheidung durchgeführt werden soll. Nun können in geschweiften Klammern die einzelnen Fälle unterschieden werden. Dies geschieht durch das Wort "case", gefolgt vom Wert den die Variable oder der Ausdruck hat und einem Doppelpunkt. Danach kommt die Anweisung, die ausgeführt werden soll, wenn der Fall eintritt. Es können auch mehrere Anweisungen definiert werden. Abgeschlossen werden die einzelnen Fälle in der Regel jeweils mit dem "break;"-Befehl. Damit wird die Überprüfung der Fälle an der Stelle abgebrochen, wo eine Übereinstimmung vorliegt. Lässt man "break" weg, werden die anderen Bedingungen überprüft weiter überprüft. Trifft keiner der definierten Fälle zu, kann hinter "default:" eine alternative Anweisung definiert werden.

Beispiel: var x = window.prompt("Bitte geben sie eine Zahl ein", "");

switch (x)
{
case "1":
alert("Sie haben die Zahl 1 eingegeben.");
break;

case "2":
alert("Sie haben die Zahl 2 eingegeben.");
break;

case "3":
alert("Sie haben die Zahl 3 eingegeben.");
break;

case "4":
alert("Sie haben die Zahl 4 eingegeben.");
break;

default:
alert("Sie haben weder 1, 2, 3 noch 4 eingegeben.");
break;
}

Die Fallunterscheidung soll in diesem Fall für die Variable "x" durchgeführt werden. In "x" wird die Zahl gespeichert, die der Nutzer im Dialogfenster eingibt. In den Fällen, dass die Zahl 1, 2, 3 oder 4 ist, wird ausgegeben, um welche Zahl es sich handelt. Handelt es sich um eine andere Zahl, wird "Sie haben weder 1, 2, 3 noch 4 eingegeben." angezeigt.

Es gibt auch die Möglichkeit, viele if-Anweisungen hinter einander zu schreiben, um mehrere Fallunterscheidungen durchzuführen, die switch-Methode ist lediglich die elegantere Art dies zu tun.

Schleifen

Schleifen dienen dazu, die in ihnen definierten Anweisungen je nach festgelegter Bedingung zu wiederholen.

- Die while-Schleife

Die Anweisungen in der while-Schleife werden solange wiederholt, bis die dafür definierte Bedingung erfüllt ist. Trifft die Bedingung von vornherein nicht zu, wird die Schleife ignoriert.

Die while-Schleife wird mit dem Wort "while" eingeleitet. Danach folgt in runden Klammern die Bedingung, für die die Schleife durchlaufen werden soll. Solange die Bedingung erfüllt ist, werden die in geschweiften Klammern stehenden Anweisungen immer wieder ausgeführt.

Beispiel: x = 1;

while (x < 10)
{
alert (x);
x++;
}

Die Variable x bekommt den Startwert 1 zugewiesen. Solange x kleiner als 10 ist, wird der Wert für x ausgegeben und die Variable um eins erhöht.

Man sollte darauf achten, dass es immer eine Möglichkeit gibt, die Schleife zu beenden. Ansonsten läuft man Gefahr, eine Endlosschleife zu erzeugen, aus der man nur durch Beenden des Internetbrowsers herauskommt. Die while-Schleife ist wichtig, wenn die Anzahl der nötigen Wiederholungen nicht vorher feststeht.

- Die do-while-Schleife

Die do-while-Schleife ist eine spezielle Art der while-Schleife. Während bei der while-Schleife zuerst geprüft wird, ob die Bedingung erfüllt ist und dann die Anweisung ausgeführt wird, ist es bei der do-while-Schleife genau umgekehrt. Die Anweisung wird ausgeführt, bevor die Bedingung dafür überhaupt geprüft wurde. So wird erzwungen, dass die Anweisung mindestens einmal durchlaufen wird.

Beispiel: x = 10;

do
{
alert (x);
x++;
}

while (x < 10)

Im Beispiel ist die Bedingung für die Schleife nicht erfüllt. Da mit "do" aber die Anweisungen vor der Schleifenbedingung durchlaufen werden, wird die Zahl 10 ausgegeben und um 1 hochgezählt.

- Die for-Schleife

Die for-Schleife ist der while-Schleife sehr ähnlich. Allerdings ist in der for-Schleife bereits einen Initialisierungsteil und ein Aktualisierungsteil vorgesehen.

Die Schleife wird mit dem Wort "for" eingeleitet. Dahinter folgt in runden Klammern der Initialisierungsteil, die Bedingung für die Schleife und der Aktualisierungsteil jeweils durch Semikolon getrennt. In geschweiften Klammern werden die Anweisungen definiert.

Beispiel: for (x = 1; x < 10; x++)
{
alert (x);
}

Die Funktionsweise ist dieselbe wie bei der while-Schleife.

- Die for-in-Schleife

Die for-in-Schleife ist eine spezielle Art der for-Schleife. Mittels der Schlüsselwörter for und in lässt sich für jedes Attribut eines Objekts eine Aktion ausführen.

Beispiel: var Ergebnis = "Attribute des Objekts ‚window':"+ "";

for (var Attribut in window)
{
Ergebnis = Ergebnis + "window." + String(Attribut) + "\n";
}

document.write(Ergebnis);

Es werden alle Attribute des Objektes "window" ausgegeben.

- Abbruch mittels "break" und "continue"

Innerhalb von Schleifen kann man zusätzlich mit den Befehlen "break" und "continue" Abbrüche erzwingen.

Der Befehl "break" bricht die Schleife sofort an der Stelle, wo er steht ab.

Beispiel: for (x=1; x<10; x++)
{
if (x ==5)
{
break;
}
alert(x);
}

Die Schleife wird sobald x den Wert 5 hat sofort beendet.

Mit "continue" wird nicht die gesamte Schleife, sondern nur der aktuelle Durchlauf beendet. Es wird sofort mit dem nächsten Durchlauf fortgefahren.

Beispiel: for (x=1; x<10; x++)
{
if (x ==5)
{
continue;
}
alert(x);
}

Wenn x den Wert 5 hat, wird der Schleifendurchlauf abgebrochen, bevor "5" auf dem Bildschirm ausgegeben werden kann. Es sind also die Zahlen 1, 2, 3, 4, 6, 7, 8 und 9 zu sehen. Top