Funktionen 1

Eine Funktion definiert einen Block von Anweisungen. Die zusammengehörenden Anweisungen werden dazu in geschweifte Klammern gesetzt. Eine Funktion hat einen Namen, über den sie aufgerufen werden kann. Funktionen können Werte übergeben werden und Funktionen können auch Werte zurückgeben. So kann z. B. eine bestimmte Berechnung als Funktion definiert werden, der Parameter übergeben werden und die das Ergebnis ausgibt. I. d. R. werden Funktionen für bestimmte sich öfters wiederholende Aufgaben verwendet, so dass diese in einem Computerprogramm nicht immer neu, d. h. redundant, definiert werden müssen.

Eine Funktion wird in JavaScript mit dem Schlüsselwort „function“ gefolgt von dem Namen der Funktion und einer runden Klammer definiert:

Die zur Funktion gehörenden Anweisungen werden dann in geschweifte Klammern gesetzt:

Parameter werden in der runden Klammer durch Komma getrennt übergeben. Die Parameter entsprechen innerhalb des Anweisungsblocks lokalen Variablen. Beim Aufruf der Funktion werden dann konkrete Werte anstelle der Parameternamen in der runden Klammer übergeben:

Mit dem Schlüsselwort „return“ wird der Programmablauf in JavaScript-Funktionen unterbrochen. Außerdem können Variablen bzw. Werte, die dem Schlüsselwort folgen als Ausgabe einer Funktion übergeben werden. An der Stelle im Programm, an welcher der Funktionsaufruf erfolgt ist, wird dann das Ergebnis der Funktion ausgegeben:

Im folgenen Beispiel wird die Berechnung des Umfangs aus einem gegebenen Radius in einer Funktion definiert, die nun mehrmals aufgerufen werden kann:

HTML-Datei:

Ergebnis:

Eine Funktions-Definition kann auch in einer Variablen abgespeichert werden. Der Aufruf der Funktion erfolgt dann mit Hilfe der Variablen. Ein Name für die Funktion entfällt dabei:

HTML-Datei:

Ergebnis:

Wird eine Funktion ohne runde Klammern aufgerufen, wird die Funktions-Definition zurück-gegeben:

HTML-Datei:

Ergebnis:

Funktionen können in JavaScript auch selbstaufrufend verwendet werden. Dabei wird die Funktions-Definition in runde Klammern gesetzt und zusätzlich runde Klammern angehängt, wodurch der Ausdruck gleichzeitig zu einem Funktionsaufruf wird:

HTML-Datei:

Ergebnis:

Funktionen werden bei JavaScript intern wie Objekte behandelt. Daher können Funktionen auch mit dem Schlüsselwort „new“ und dem Standard-Konstruktor für Funktionen in JavaScript „Function()“ definiert werden:

HTML-Datei:

Ergebnis:

Funktionen verfügen, wie auch Objekte, über einige Standard-Eigenschaften und -Methoden. Die Eigenschaft „length“ gibt bei Funktionen die Anzahl der Eingabeparameter aus und die Methode „toString()“ wandelt die Funktionsdefinition in eine Zeichenkette um:

HTML-Datei:

Ergebnis:

Als Abschlussübung kannst du das erste Beispiel erweitern und zusätzlich die jeweilige Oberfläche von Erde und Mond berechnen und ausgeben:

Gehe dabei wie folgt vor:

• Erweitere die Beschreibung der Himmelskörper um den entsprechenden Text und jeweils um ein weiteres „span“-Element mit einer eindeutigen ID
• Erstelle eine weitere JavaScript-Funktion in der die Oberfläche berechnet wird (4*3,14*r²)
• Gib die Oberfläche in den entsprechenden „span“-Elementen aus

Die Lösung kannst du dir hier herunterladen:

https://www.w3schools.com/js/js_functions.asp

https://www.w3schools.com/js/js_function_definition.asp