Funktionen
Funktion definieren
SELFHTML-Extrakt
Hier könnte vielleicht eine ganz kurze Zusammenfassung der wesentlichen Punkte dieses Abschnitts stehen.
Mit Hilfe von Funktionen können Sie eigene, in sich abgeschlossene JavaScript-Prozeduren programmieren, die Sie dann über den Aufruf der Funktion ausführen können. Dabei können Sie bestimmen, bei welchem Ereignis (zum Beispiel, wenn der Anwender einen Button anklickt) die Funktion aufgerufen und ihr Programmcode ausgeführt wird. JavaScript-Code, der nicht innerhalb einer Funktion steht, wird beim Einlesen der Datei vom WWW-Browser sofort ausgeführt!
Eine Funktion ist ein 
Anweisungsblock.
Sie können eigene Funktionen innerhalb eines
JavaScript-Bereichs
oder in einer
separaten JavaScript-Datei definieren.
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.
Beispiel einer JavaScript-Funktion:
function PrimzahlCheck (Zahl) {
if (Zahl >= 2) {
var Grenzzahl = Zahl / 2;
var Check = 1;
for (var i = 2; i <= Grenzzahl; i++)
if (Zahl % i == 0) {
alert(Zahl + " ist keine Primzahl, weil teilbar durch " + i);
Check = 0;
}
if (Check == 1)
alert(Zahl + " ist eine Primzahl!");
} else {
alert("Bitte geben Sie eine natürliche Zahl größer als 1 ein!");
}
}
Erläuterung:
Mit dem Schlüsselwort function leiten Sie die
Definition einer Funktion ein. Dahinter folgt, durch ein Leerzeichen
getrennt, ein frei wählbarer Funktionsname, im Beispiel: PrimzahlCheck.
Vergeben Sie einen Funktionsnamen, der das, was die Funktion leistet, ungefähr beschreibt.
Beachten Sie dabei die Regeln für
selbst vergebene Namen.
Unmittelbar hinter dem Funktionsnamen folgt eine öffnende Klammer.
Wenn die Funktion keine Parameter erwarten soll, notieren Sie dahinter
sofort wieder eine schließende Klammer. Wenn die Funktion Parameter
übergeben bekommen soll, notieren Sie 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.
Mehrere Parameter werden durch Kommata voneinander getrennt. Im obigen
Beispiel erwartet die Funktion PrimzahlCheck einen Parameter Zahl.
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. Sie können innerhalb von Funktionen auch andere
Funktionen aufrufen. Welche Anweisungen innerhalb einer Funktion
stehen, hängt davon ab, was die Funktion leisten soll. Im obigen
Beispiel wird ermittelt, ob die übergebene Zahl eine Primzahl ist. Wenn
es keine ist, wird für jede Zahl, durch die sie teilbar ist, eine
entsprechende Meldung ausgegeben. Wenn es eine Primzahl ist, wird am
Ende ausgegeben, dass es sich um eine Primzahl handelt.
Funktion aufrufen
Sie können eine selbst definierte Funktion aufrufen, um den darin enthaltenen JavaScript-Code auszuführen.
Beispiel:
Anzeigebeispiel: So sieht's aus
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function PrimzahlCheck (Zahl) {
Zahl = parseInt(Zahl, 10);
if (isNaN(Zahl)) {
alert("Sie müssen eine Zahl eingeben!");
return;
}
var Grenzzahl = Zahl / 2;
var Check = 1;
for (var i = 2; i <= Grenzzahl; i++)
if (Zahl % i == 0) {
alert(Zahl + " ist keine Primzahl, weil teilbar durch " + i);
Check = 0;
}
if (Check == 1)
alert(Zahl + " ist eine Primzahl!");
}
</script>
</head>
<body>
<form name="PrimzahlFormular" action="">
<p>Geben Sie eine Zahl ein. Es wird geprüft, ob es sich um eine Primzahl handelt.</p>
<input type="text" name="Eingabezahl">
<input type="button" value="auf Primzahl checken"
onclick="PrimzahlCheck(document.PrimzahlFormular.Eingabezahl.value)">
</form>
</body>
</html>
Erläuterung:
Das obige Beispiel zeigt eine komplette HTML-Datei. Darin ist ein JavaScript-Bereich definiert, in dem wiederum die Funktion PrimzahlCheck()
definiert ist. Im Dateikörper der HTML-Datei steht ein Formular mit
einem Eingabefeld und einem Button. Im Eingabefeld kann der Anwender
eine Zahl eingeben. Wenn er auf den Button klickt, wird die
JavaScript-Funktion aufgerufen und ermittelt, ob es sich bei der
Eingabe um eine Primzahl handelt. Dazu enthält der Button den Event-Handler onclick (= beim Anklicken). Dahinter wird die JavaScript-Funktion mit der eingegebenen Zahl aufgerufen.
Die Funktion rufen Sie mit ihrem Funktionsnamen auf. Dahinter folgt die öffnende Klammer. Wenn die Funktion keine Parameter erwartet, notieren Sie hinter der öffnenden gleich eine schließende Klammer. Wenn die Funktion Parameter erwartet, müssen Sie für jeden Parameter einen erlaubten Wert übergeben. Im Beispiel erwartet die Funktion einen Parameter. Wenn Sie mehrere Parameter übergeben, trennen Sie diese durch Kommata.
Funktion mit Rückgabewert und solche Funktion aufrufen
Eine Funktion kann einen ermittelten Wert an die aufrufende Instanz zurückgeben.
Beispiel:
Anzeigebeispiel: So sieht's aus
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function BruttoBetrag (Netto, Prozente) {
var Ergebnis = Netto * (1 + (Prozente / 100));
return Ergebnis;
}
function SchreibeBrutto (Betrag, Prozentsatz) {
var Wert = BruttoBetrag(Betrag, Prozentsatz);
document.BruttoForm.Ergebnisfeld.value = Wert;
}
</script>
</head>
<body>
<form name="BruttoForm" action="">
<pre>
Nettobetrag: <input type="text" name="NettoEingabe">
Prozentsatz: <input type="text" name="ProzentEingabe"></pre>
<p>Kommabetrag mit Punkt eingeben!</p>
<input type="button" value="Brutto ermitteln"
onclick="SchreibeBrutto(document.BruttoForm.NettoEingabe.value,document.BruttoForm.ProzentEingabe.value)">
<pre>
Ergebnis: <input type="text" name="Ergebnisfeld"></pre>
</form>
</body>
</html>
Erläuterung:
Das obige Beispiel zeigt eine HTML-Datei, in deren Dateikopf ein JavaScript-Bereich definiert ist, in dem wiederum die zwei Funktionen BruttoBetrag(...) und SchreibeBrutto(...)
definiert sind. Im Dateikörper der HTML-Datei steht ein Formular mit je
einem Eingabefeld für einen Nettobetrag und einen Prozentwert. Wenn der
Anwender auf den darunter definierten Button klickt, wird die Funktion SchreibeBrutto(...) aufgerufen. Diese wiederum ruft die Funktion BruttoBetrag(...) auf.
Da die Funktion BruttoBetrag(...) ihr errechnetes Ergebnis an die aufrufende Instanz zurückgibt, wird in SchreibeBrutto(...) eine Variable mit dem Namen Wert
definiert, die diesen Rückgabewert speichert. Das Ergebnis, das in
dieser Variablen gespeichert ist, schreibt die Funktion schließlich in
ein Feld, das innerhalb des Formulars eigens für diesen Zweck
eingerichtet wurde: das Eingabefeld mit dem Namen Ergebnisfeld.
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.
Beispiel:
Anzeigebeispiel: So sieht's aus
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function Rechne (Operation) {
var Ergebnis = eval(Operation);
alert("Ergebnis: " + Ergebnis);
}
</script>
</head>
<body>
<form name="Formular">
<p>Geben Sie eine Rechenaufgabe (z.B. 8*5) ein:</p>
<input type="text" name="Eingabe">
<input type="button" value="OK"
onclick="Rechne(document.Formular.Eingabe.value)">
</form>
</body>
</html>
Erläuterung:
Das obige Beispiel zeigt eine HTML-Datei mit einem JavaScript-Bereich, in dem wiederum eine Funktion Rechne()
definiert ist. Innerhalb des Dateikörpers der HTML-Datei ist ein
Formular mit einem Eingabefeld notiert. In dem Eingabefeld kann der
Anwender eine Rechenaufgabe eingeben, z.B. 1 + 1 oder (28.76 - 0.00001) * 7. Beim Anklicken des Klick-Buttons wird die Funktion Rechne()
aufgerufen. Sie erwartet als Parameter eine Rechenaufgabe. Deshalb wird
ihr der Inhalt des Formulareingabefeldes beim Aufruf übergeben. Die
Funktion Rechne bedient sich zur Berechnung des Ergebnisses der äußerst mächtigen vordefinierten Funktion eval() (eval = evaluate = berechne).
Diese kann - unter anderem - Rechenoperationen als solche erkennen und
ausrechnen. Das Rechenergebnis wird im Beispiel in einem
Meldungsfenster ausgegeben.
Beachten Sie:
Eine Übersicht aller vordefinierten JavaScript-Funktionen finden Sie im Abschnitt Objektunabhängige Funktionen.
