Homepage-Webhilfe Event-Banner

Funktionen

Funktionen sind dazu gedacht, einen Code mehrmals (und von verschiedenen Stellen) zu nutzen. Die Funktionen und Objekte, welche zum JavaScript-Sprachkern gehören, sind bereits im Browser bzw. JavaScript-Interpreter integriert. Deren Code wird als „native code“ bezeichnet und kann nicht ohne weiteres eingesehen werden.

Um eigene Funktionen zu definieren, notieren wir das Schlüsselwort function gefolgt von einem Leerzeichen und dem Namen der Funktion. Der Funktionsname ist, wie der Variablenname auch, frei definierbar, muss jedoch innerhalb des Gültigkeitsbereichs eindeutig sein. Auch für Funktionen sollte die „Camel Case“-Schreibweise angewendet werden. Oft werden in JavaScript deutsche Funktionsnamen am Anfang groß geschrieben. Dies ist jedoch nur eine Frage des Programmierstils. Zurück zur Funktionsnotation: Hinter dem Funktionsname wird ein rundes Klammernpaar notiert. Innerhalb der Klammern können nun die Parameter für die Funktion kommagetrennt angegeben werden. Die Namen dieser Parameter können ebenfalls wieder frei definiert werden. Variablennamen innerhalb der Funktion, sowie die Namen der Parameter selbst, dürfen dabei jedoch nicht mehrmals vorkommen und müssen somit eindeutig sein. Nach der schließenden runden Klammer notieren wir ein Paar von geschweiften Klammern (Block). Innerhalb des Blocks wird nun der Code der Funktion notiert.

Um Funktionen aufzurufen, notieren wir den Namen der Funktion, gefolgt von einem runden Klammernpaar, in welchem die Werte für die Parameter kommagetrennt angegeben werden. Da es sich bei dem Funktionsaufruf um ein Statement handelt, muss am Ende ein Semikolon notiert werden.

function Ausgabe()
{
	alert("Herzlich Willkommen!");
}

function AusgabeMitParameter(name)
{
	document.write("Hallo " + name + "!");
}

Ausgabe();
AusgabeMitParameter("Peter");
Vorschau

Um Parameter von Funktionen als optionale Parameter zu kennzeichnen, können wir bei der Deklaration der Funktion nach dem Parametername ein Gleichheitszeichen gefolgt von dem zum Parameter gehörenden Standardwert (engl. default value) angeben. Dabei gilt zu beachten, dass optionale Parameter immer „ganz rechts“ stehen müssen. Die Reihenfolge zur Angabe der Parameter muss dabei immer eingehalten werden. Haben wir z. B. eine Funktion mit den Paramatern a, b, c und d, bei welcher der Parameter c und d optional sind, so ergeben sich folgende 3 Möglichkeiten zum Aufruf der Funktion: (a, b), (a, b, c) und (a, b, c, d). Hierzu ein Beispiel:

function Addieren(a, b, c = 0, d = 0)
{
    document.write(a + b + c + d);
    document.write("<br />");
}

Addieren(1, 2);
Addieren(1, 2, 3);
Addieren(1, 2, 3, 4);
Vorschau

Funktionen können einen sogenannten Rückgabewert haben. Der Rückgabewert erlaubt es, Informationen an den Aufrufer zurückzugeben. Diesen Rückgabewert haben wir schon bei vielen Funktionen wie z. B. bei parseInt() genutzt. Um von der Funktion aus einen Wert zurückzugeben notieren wir das Schlüsselwort return, gefolgt von dem Wert, welcher zurückgegeben werden soll. Da es sich um ein Statement handelt, wird auch hier am Ende ein Semikolon verwendet.

function Addition(zahlA, zahlB)
{
	return zahlA + zahlB;
}

document.write("Das Ergebnis aus 3 + 8 ist: " + Addition(3, 8));
Vorschau

Wichtig: Durch das Schlüsselwort return springen wir aus der Funktion. Anweisungen die „unterhalb“ der return-Anweisung notiert sind, werden nicht mehr ausgeführt.

Übrigens: Bei einer Funktion, welche keinen Rückgabewert hat, können wir das return-Statement auch einfach dazu nutzen, um aus der Funktion „herauszuspringen“.


Die Notierung einer Funktion als Funktionsausdruck (bisher hat es sich immer um Funktionsdeklaration gehandelt) erlaubt es, die Funktion einer Variablen oder einem Objekt zuzuweisen. Der bisherige Syntax von der Funktionsdeklaration bleibt bei dem Funktionsausdruck gleich, jedoch mit dem Unterschied, dass kein Funktionsname mehr angegeben wird, denn ab sofort wird die Funktion mittels der Variable oder des Objekts aufgerufen. Wird eine Funktion einer Variablen zugewiesen, muss natürlich darauf geachtet werden, dass nach der schließenden geschweiften Klammer } ein Semikolon ; notiert werden muss.

var add = function (zahlA, zahlB)
{
	return zahlA + zahlB;
};

document.write("Das Ergebnis aus 3 + 8 ist: " + add(3, 8));
Vorschau

Selbst-aufrufende Funktionen (engl. self invoking functions) rufen, wie der Name schon sagt, sich selbst völlig automatisch auf. Genutzt werden solche Funktionen, um Quellcode zu gliedern und strukturieren. Denn es ist auch möglich, neben „normalem Quellcode“, weitere Variablen und sogar Funktionen innerhalb dieser Funktion zu notieren. Diese sind dann aber nur innerhalb der selbst-aufrufenden Funktion verfügbar (Gültigkeitsbereich) und können somit „von außen“ nicht aufgerufen, abgerufen oder geändert werden.

Die Angabe einer selbst-aufrufenden Funktion erfolgt ähnlich wie die eines Funktionsausdrucks. Zusätzlich muss der ganze Ausdruck noch in ein rundes Klammernpaar gepackt werden. Hinter der letzten schließenden runden Klammer ) muss nun noch ein weiteres rundes Klammernpaar angegeben werden, welches dem Funktionsaufruf entspricht. Hier ist es natürlich auch wieder möglich, Parameter mitzugeben (sofern diese bei der Deklaration des Funktionsausdrucks notiert wurden).

Das folgende Beispiel enthält 3 selbst-aufrufende Funktionen: Die erste Funktion stellt dabei eine ganz einfache Funktion ohne Parameter dar, die zweite verfügt über einen Funktionsparameter und die dritte gibt zusätzlich noch einen Wert zurück, wessen Rückgabe direkt mittels document.write() auf die Seite geschrieben wird.

(function ()
{
	alert("Herzlich Willkommen!");
})();

(function (name)
{
	document.write("Hallo " + name + "!");
})("Peter");

document.write("<br />");

document.write("Das Ergebnis aus 3 + 8 ist: " + 
   (function (zahlA, zahlB)
	{
		return zahlA + zahlB;
	})(3, 8)
);
Vorschau

Wichtig: In JavaScript gibt es einige Funktionen, wo Funktionen als Referenz übergeben werden müssen. Hier kann dann entweder ein Funktionsausdruck notiert werden oder der Name der Funktion ohne Klammern. Würden wir an dieser Stelle den Funktionsnamen mit Klammern angeben, so würde die Funktion direkt aufgerufen werden. Dies ist jedoch nicht gewünscht, da die Funktion erst beim Eintreten eines Ereignisses aufgerufen werden soll.

window.onload = MeineFunktion;
Vorschau
Um unsere Webseite für Sie optimal zu gestalten und fortlaufend verbessern zu können, verwenden wir Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu. Weitere Informationen OK