Lange Funktionen in JavaScript
Wir haben Funktionsausdrücke mit einem Symbol »=>«, das einem dicken Pfeil ähnelt, schon kennengelernt.
- Auswertung
( ( x, y )=> x + y )( 10, 2 )
12
Neben der gezeigten Schreibweise mit einem Pfeil gibt es auch noch eine andere, längere Schreibweise für Funktionen, welche die beiden Wörter »function« und »return« verwendet. Alle bisher gezeigten Beispiele für Funktionsausdrücke könnte man auch mit jener längeren Schreibweise schreiben.
Eine „lange Funktion“ (wie wir sie kurz nennen) wird mit »function(« eingeleitet wird; es folgt dann die Parameterliste und »){ return«, danach folgt der Ausdruck, welcher das Ergebnis der Funktion festlegt und schließlich noch »; }«.
- Die „lange Schreibweise“
Ausdruck
.--------. .-. .----------------. .-. .-. .------. .----------. .-. .-.
--->( function )--->( ( )--->| Parameterliste |--->( ) )--->( { )--->( return )--->| Ausdruck |--->( ; )--->( } )--->
'--------' '-' '----------------' '-' '-' '------' '----------' '-' '-'- Auswertung
( function( x, y ){ return x + y; } )( 10, 2 )12
Wir können die Pfeilschreibweise und die lange Schreibweise folgendermaßen untereinanderschreiben.
- Vergleich
--------- ------------ ---
( x, y )=> { return x + y ; }
function( x, y ) { return x + y ; }
--------- ------------ ---
Diese lange Schreibweise ist komplizierter als die Schreibweise einer Pfeilfunktion (wie wir sie kurz nennen). Nachdem die Bedeutung eines Funktionsausdrucks aber zunächst mit der einfachen Pfeilschreibweise erlernt wurd, kann man sich die kompliziertere längere Schreibweise nun durch die Pfeilschreibweise erklären.
Wir können uns noch des Typs der Funktionen vergewissern:
- Auswertung
typeof ( ( x, y )=> x + y )
"function"
- Auswertung
typeof ( function( x, y ){ return x + y; } )"function"
In späteren Lektionen werden wir noch Unterschiede zwischen Pfeilfunktionen und langen Funktionen kennenlernen, die dazu führen, daß man manchmal die eine und manchmal die andere Schreibweise verwendet.
Übungsfragen
? Übungsfragen
Können Sie die Werte der folgenden Ausdrücke vorhersagen?
- Ausdruck
( function( x ){ return 4; } )( 3 )- Ausdruck 1
( function( x ){ return 7; } )( 2 )- Ausdruck 2
( function( x ){ return 7; } ).length- Ausdruck 3
( function( x ){ return 1; } )( 9 )- Ausdruck 4
( function(){ return 3; } )()- Ausdruck 5
( function( x ){ return x; } )( 9 )- Ausdruck 6
( function( x ){ return 4; } )( 9 )- Ausdruck 7
( function( x ){ return 4; } )( 8 )- Ausdruck 8
( function( x ){ return x; } )( 8 )- Ausdruck 9
( function( x ){ return x / 2; } )( 8 )- Ausdruck 10
( function( x ){ return x / 2; } )( 10 )- Ausdruck 11
( function( x ){ return x / x; } )( 10 )- Ausdruck 12
( function( x ){ return x + 2; } )( 10 + 2 )- Ausdruck 13
( function( x ){ return x + x; } )( 10 + 2 )- Ausdruck 14 *
( function( x ){ return x(); } )( ( x )=> 2 )- Ausdruck 15
( function( x ){ return 4; } )( 3 )- Ausdruck 16
( function( x ){ return x; } )( 9 )- Ausdruck 17
( function( o ){ return o; } )( 9 )- Ausdruck 18
( function( x ){ return 2 + x; } )( 3 )- Ausdruck 19
( function( x, y = 8 ){ return x + y; } )( 2, 1 )- Ausdruck 20
( function( x, y = 8 ){ return x + y; } ).length- Ausdruck 21
( function( y, x = 8 ){ return x + y; } )( 2, 1 )- Ausdruck 22
( function( o, v = 8 ){ return v + v; } )( 2, 1 )- Ausdruck 23
( function( o, v = 8 ){ return v + v; } )( 2 )- Ausdruck 24
( function( o, v = 8 ){ return v + v; } )( 2 )- Ausdruck 25 *
( function( x ){ return function( o ){ return x + o; }; } )( 3 )( 4 )- Ausdruck 26 *
( function( x ){ return function( o ){ return x + o; }; } )( 3 )- Ausdruck 27 *
( function( x, y ){ return function( o, u, v, w ){ return x + o; }; } )( 3 ).length