Eine Funktion ist ein Block aus organisiertem, wiederverwendbarem Code, mit dem eine bestimmte Aktion ausgeführt wird. Es gibt mehrere Möglichkeiten, Funktionen in JavaScript zu definieren. Hier schauen wir uns Funktionsdeklarationen und Funktionsausdrücke an. Andere Möglichkeiten wie Arrow-Funktionen werden in anderen Konzepten behandelt.
Die übliche Art, eine Funktion in JavaScript zu definieren, ist eine Funktionsdeklaration, auch Funktionsdefinition oder Funktionsanweisung genannt.
Sie besteht aus dem function-Schlüsselwort, dem Namen der Funktion und einer durch Kommas getrennten Liste von Parametern in runden Klammern.
Darauf folgt der Funktionskörper (eine Sammlung von Anweisungen, die definiert, was eine Funktion tut), eingeschlossen in geschweifte Klammern.
function someName(param1, param2, param3) {
// ...
}
In JavaScript wird eine Funktion aufgerufen, indem man den Funktionsnamen angibt, gefolgt von runden Klammern, die die Argumente enthalten.
someName(arg1, arg2, arg3);
Wenn du mit Parametern im Funktionskörper arbeitest, achte auf mögliche Seiteneffekte.
Standardmäßig sind alle Parameter, die in der Funktionsdeklaration definiert sind, in JavaScript optional.
Wenn du weniger Argumente übergibst, als es Parameter gibt, sind die fehlenden Argumente innerhalb der Funktion undefined, siehe Null und undefined.
In vielen Fällen ist es sinnvoll, einen passenderen Standardwert als undefined zuzuweisen.
Das kannst du tun, indem du Standardparameter direkt in der Funktionsdefinition angibst.
function someName(param1 = defaultValue1, param2 = defaultValue2) {
// ...
}
Eine return-Anweisung beendet die Ausführung der Funktion und legt einen Wert fest, der an den Aufrufer der Funktion zurückgegeben wird. Eine Funktion kann mehrere return-Anweisungen haben.
function checkNumber(num) {
if (num === 0) {
return 'You passed 0, please provide another number.';
}
return 'Thanks for passing such a nice number.';
}
Der Rückgabewert einer Funktion kann in einer Variablen gespeichert werden.
function sum(x, y) {
return x + y;
}
const total = sum(5, 10);
// => 15
Das Ergebnis einer Funktion, die keinen Wert zurückgibt oder keine return-Anweisung hat, ist undefined.
In JavaScript gibt es keine impliziten returns.
function nakedReturn(a) {
a * 2;
return;
}
nakedReturn(1);
// => undefined
function noReturn(a) {
a * 2;
}
noReturn(1);
// => undefined
In JavaScript kannst du genau einen Wert zurückgeben. Wenn du mehr Informationen übergeben möchtest, musst du sie zuerst zu einer einzigen Einheit zusammenfassen, meist zu einem Objekt oder einem Array.
function divide(a, b) {
return {
quotient: Math.floor(a / b),
remainder: a % b,
};
}
Eine Funktionsdeklaration ist eine eigenständige Anweisung. Manchmal ist es aber hilfreich, eine Funktion als Teil eines anderen Ausdrucks zu definieren, z. B. in einer Zuweisung, als Funktionsparameter (Callback) oder als Wert in einem Objekt. Das kannst du mit einem Funktionsausdruck machen. Er hat dieselbe Syntax wie eine Funktionsdeklaration, nur dass der Funktionsname weggelassen werden kann, um eine anonyme Funktion zu erstellen.
const someFunction = function (param) {
// ...
};
someOtherFunction(function (param) {
// ...
});
const obj = {
someFunction: function (param) {
// ...
},
};
In dieser Übung schreibst du noch etwas mehr Code rund um die Vorbereitung und das Kochen deiner großartigen Lasagne aus deinem Lieblingskochbuch.
Du hast fünf Aufgaben. Die erste dreht sich um das Kochen selbst, bei den anderen vier geht es um die perfekte Vorbereitung.
Wenn du eine Lasagne im Ofen hast, willst du wissen, ob du sie schon herausnehmen kannst oder nicht. Damit die Lasagne im Ofen nicht anbrennt, stellst du normalerweise einen Timer. Manchmal vergisst du das aber.
Schreibe eine Funktion cookingStatus, die die verbleibende Zeit auf dem Timer in Minuten als Parameter entgegennimmt.
Die Funktion kann drei verschiedene Ergebnisse liefern.
0 anzeigt, sollte sie 'Lasagna is done.' zurückgeben.'Not done, please wait.'.'You forgot to set the timer.'.Der Timer zeigt niemals einen Wert unter 0 an.
cookingStatus(12);
// => 'Not done, please wait.'
cookingStatus();
// => 'You forgot to set the timer.'
Für die nächste Lasagne, die du zubereitest, willst du genug Zeit einplanen, damit du das Kochen genießen kannst. Du hast bereits einen Plan mit allen Schichten deiner Lasagne gemacht. Jetzt willst du abschätzen, wie lange die Vorbereitung damit dauern wird.
Implementiere eine Funktion preparationTime, die ein Array aus Schichten und die durchschnittliche Vorbereitungszeit pro Schicht in Minuten entgegennimmt.
Die Funktion sollte die geschätzte Gesamtvorbereitungszeit auf Basis der Anzahl der Schichten zurückgeben.
Wird die Funktion ohne durchschnittliche Vorbereitungszeit aufgerufen, sollten stattdessen 2 Minuten angenommen werden.
const layers = ['sauce', 'noodles', 'sauce', 'meat', 'mozzarella', 'noodles'];
preparationTime(layers, 3);
// => 18
preparationTime(layers);
// => 12
Neben der Zeit möchtest du auch sicherstellen, dass du genug Soße und Nudeln hast, um die Lasagne deiner Träume zu kochen. Für jede Nudelschicht in deiner Lasagne brauchst du 50 Gramm Nudeln. Für jede Soßenschicht in deiner Lasagne brauchst du 0,2 Liter Soße.
Definiere die Funktion quantities, die ein Array aus Schichten als Parameter entgegennimmt.
Die Funktion ermittelt dann die Menge an Nudeln und Soße, die du für dein Essen brauchst.
Das Ergebnis sollte als Objekt mit den Schlüsseln noodles und sauce zurückgegeben werden.
quantities(['sauce', 'noodles', 'sauce', 'meat', 'mozzarella', 'noodles']);
// => { noodles: 100, sauce: 0.4 }
Vor einer Weile hast du einen Freund besucht und dort Lasagne gegessen. Sie war fantastisch und hatte etwas Besonderes an sich. Dein Freund schickte dir die Zutatenliste und sagte dir, dass der letzte Eintrag auf der Liste die „geheime Zutat“ ist, die das Essen so besonders gemacht hat. Jetzt willst du diese geheime Zutat auch zu deinem Rezept hinzufügen.
Schreibe eine Funktion addSecretIngredient, die zwei Arrays mit Zutaten als Parameter entgegennimmt.
Der erste Parameter ist die Liste, die dein Freund dir geschickt hat, und der zweite ist die Zutatenliste für dein eigenes Rezept.
Die Funktion sollte den letzten Eintrag aus der Liste deines Freundes an das Ende deiner Liste anhängen.
Das Array, das dein Rezept darstellt, sollte direkt verändert werden, und die Funktion sollte nichts zurückgeben.
Das erste Argument darf jedoch nicht verändert werden.
const friendsList = ['noodles', 'sauce', 'mozzarella', 'kampot pepper'];
const myList = ['noodles', 'meat', 'sauce', 'mozzarella'];
addSecretIngredient(friendsList, myList);
// => undefined
console.log(myList);
// => ['noodles', 'meat', 'sauce', 'mozzarella', 'kampot pepper']
Die Mengen in deinem Kochbuch reichen nur für zwei Portionen Lasagne. Da du nächstes Mal für mehr Leute kochen willst, möchtest du die Mengen für verschiedene Anzahlen von Portionen berechnen.
Implementiere eine Funktion scaleRecipe, die zwei Parameter entgegennimmt.
Die Funktion sollte ein Rezeptobjekt mit den Mengen zurückgeben, die für die gewünschte Anzahl an Portionen nötig sind. Das ursprüngliche Rezept möchtest du aber behalten. Das heißt, in dieser Aufgabe darf das Argument für das Rezept nicht verändert werden.
const recipe = {
noodles: 200,
sauce: 0.5,
mozzarella: 1,
meat: 100,
};
scaleRecipe(recipe, 4);
// =>
// {
// noodles: 400,
// sauce: 1,
// mozzarella: 2,
// meat: 200,
// };
console.log(recipe);
// =>
// {
// noodles: 200,
// sauce: 0.5,
// mozzarella: 1,
// meat: 100,
// };
Melde dich bei Exercism an, um JavaScript mit 37 Konzepte159 Übungen und echtem menschlichen Mentoring zu lernen und zu meistern, alles kostenlos.