SELFHTML: JavaScript / Sprachelemente / Funktionen

SELFHTML/Navigationshilfen JavaScript/DOM Sprachelemente
	Funktionen
	Funktion definieren Funktion aufrufen Funktion mit Rückgabewert und solche Funktion aufrufen Vordefinierte JavaScript-Funktionen

Funktion definieren

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 Zahlen 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) {
  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, die Zahl wird auf Primzahl gecheckt:</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.


	Steuerzeichen und besondere Notationen
	Objekte, Eigenschaften und Methoden

SELFHTML/Navigationshilfen JavaScript/DOM Sprachelemente