OOP in JavaScript

Funktionen

Funktionen spielen in JavaScript eine zentrale Rolle einerseits dienen sie als Konstruktor andererseits sind sie selbst Objekte. Eigentlich ist jede Funktion auch eine Methode, denn sie sind mit Ausnahme von anonymen Funktionen immer an ein Objekt gebunden. Es gibt wiederum verschiedene Möglichkeiten um eine Funktion zu definieren, im nachfolgenden Codeschnipsel werden die verschiedenen Formen kurz aufgezeigt.

function myfunction(x,y){ return x * y; }
alert(myfunction(2,2)) // 4

myfunction = function(x,y){ return x * y; }
alert(myfunction(2,2)) // 4

myfunction = new Function("x","y","return x * y;")
myfunction = new Function("x,y","return x * y;")
alert(myfunction(2,2)) // 4

Letztere Variante hat einen gewissen Geschwindigkeitsnachteil, weil die Funktion bei jedem Aufruf neu interpretiert wird, sie kann aber durchaus nützlich sein, weil die Möglichkeit besteht den Code als String zusammenzusetzen. Im Grunde genommen handelt es sich bei obenstehenden Funktionen um Methoden des window Objektes, denn sie sind genau gleich wie globale Variablen Eigenschaften des Selbigen.

Anonyme Funktionen

Bei den drei letzten Funktionen im oberen Abschnitt handelt es sich um anonyme Funktionen. Sie besitzen eigentlich keinen Namen, myfunction referenziert lediglich auf ein Function - Objekt. Ebenfalls besteht die Möglichkeit Funktionen ohne Zuweisung an eine Eigenschaft zu definieren. Nachfolgend wird dies veranschaulicht, indem eine Funktion definiert und sofort aufgerufen wird.

alert(function(a,b){ return a * b; }(2,2)); // 4

Arguments - Objekt

Jede Funktion besitzt ein arguments Objekt, in welchem alle übergebenen Parameter gespeichert sind. Dabei handelt es sich nicht wie vielseitig behauptet wird um ein Array, obwohl Opera 7 es als solches handhabt. Dies ermöglicht es Funktionen zu schreiben welche keine feste Anzahl Parameter erwarten. Dazu ein kurzes Beispiel.

Hobbys = function(){
	var tmp = [];
	for( var i = 0; i < arguments.length; i++){
		tmp[i] = arguments[i];
	}
	return tmp;
}

myHobbys = Hobbys("Programming","Sport");

alert(myHobbys[0] + " || " + myHobbys[1]); // "Programming || Sport"

Call() und Apply()

Wie bereits erwähnt sind Funktionen ebenfalls Objekte und besitzen dementsprechend auch Methoden wie call() und apply() Diese erlauben es eine Funktion aufzurufen und dabei this auf ein völlig anderes Objekt zu setzen. Dieses Objekt wird mit Parameter eins angegeben. Die beiden Methoden unterscheiden sich in den restlichen Parametern, welche an die aufzurufende Funktion übergeben werden, call(thisArg[, arg1[, arg2[, ...]]]) verlangt sie einzeln nach einander während apply(thisArg[, argArray]) sie als Array in Empfang nimmt.

myHobbys = [];

Hobbys = function(){
	for( var i = 0; i < arguments.length; i++){
		this[i] = arguments[i];
	}
}

Hobbys.call(myHobbys,"Programming","Sport");

alert(myHobbys[0] + " || " + myHobbys[1]); // "Programming || Sport"

myHobbys = [];

Hobbys.apply(myHobbys,["Programming","Sport"])

alert(myHobbys[0] + " || " + myHobbys[1]); // "Programming || Sport"

Dies kann besonders bei der Vererbung von Nutzen sein.

Callback

Funktionen bzw. Methoden können selbst wieder Funktionen zurückgeben, in diesem Zusammenhang spricht man häufig von Callback - Funktionen. Nun kann man entweder die zurückgegebene Funktion in einer Variablen speichern und anschliessend aufrufen oder aber direkt die Parameter für die zweite Funktion mit übergeben. Dies geschieht mit folgender Syntax myfunction(arg1,arg2)(arg1,arg2) Die innere Funktion hat Zugriff auf Parameter und Private Eigenschaften der Elternfunktion deshalb ist folgendes möglich.

multiply = function(a){
	return function(b){
		return a * b;
	}
}

tmp = multiply(2);
result = tmp(2);

alert(result); // 4

result = multiply(2)(2);

alert(result); // 4