Tracks
/
JavaScript
JavaScript
/
Übungen
/
Lasagne-Meister
Lasagne-Meister

Lasagne-Meister

Lernübung

Einführung

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.

Funktionsdeklaration

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);

Parameter

Wenn du mit Parametern im Funktionskörper arbeitest, achte auf mögliche Seiteneffekte.

  • Werte von primitiven Datentypen sind unveränderlich. Der ursprüngliche Wert wird nie dadurch beeinflusst, was mit dem Argument im Funktionskörper passiert.
  • Bei allen anderen Werten (Objekte, Arrays, Funktionen) wirkt sich eine Neuzuweisung nicht auf den ursprünglichen Wert aus. Wenn du ein solches Argument jedoch veränderst (z. B. einem Objekt einen Schlüssel hinzufügst), veränderst du auch den ursprünglichen Wert, der übergeben wurde.

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) {
  // ...
}

return-Anweisung

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,
  };
}

Funktionsausdruck

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) {
    // ...
  },
};

Anleitung

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.

1. Finde heraus, ob die Lasagne fertig ist

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.

  • Wenn der Timer 0 anzeigt, sollte sie 'Lasagna is done.' zurückgeben.
  • Zeigt der Timer eine andere Zahl, ist das Ergebnis 'Not done, please wait.'.
  • Wird die Funktion ohne Timerwert aufgerufen, ist das Ergebnis '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.'

2. Schätze die Vorbereitungszeit

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

3. Berechne die benötigten Mengen an Nudeln und Soße

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 }

4. Füge die geheime Zutat hinzu

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']

5. Skaliere das Rezept

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.

  • Ein Rezeptobjekt, das die für 2 Portionen benötigten Mengen enthält. Das Format des Objekts siehst du im folgenden Beispiel.
  • Die Anzahl der Portionen, die du kochen willst.

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,
// };
Über GitHub bearbeiten Der Link öffnet sich in einem neuen Fenster oder Tab
JavaScript Exercism

Bereit, mit Lasagne-Meister zu starten?

Melde dich bei Exercism an, um JavaScript mit 37 Konzepte159 Übungen und echtem menschlichen Mentoring zu lernen und zu meistern, alles kostenlos.