Functions 🛠️

Nach Scopes lernen wir nun das wahrscheinlich wichtigste Konstrukt in der Programmierung kennen: Functions (Funktionen). Funktionen sind der Mechanismus, der es überhaupt erlaubt, große Softwareprojekte zu schreiben und dabei die Übersicht zu behalten.

Eine Funktion ist ein Stück Code mit einem Namen, das wiederverwendet werden kann. Stell dir folgenden Code vor:

Der Code

console.log("Achtung!")
console.log("Raubtier entdeckt")

wird hierbei mehrmals wiederholt. Wenn wir ändern wollen, was bei einem Raubtier ausgegeben wird, müssen wir alle drei Stellen von Hand anfassen. Das wird schlimmer, je mehr Tiere wir einbauen.

Hier hilft eine Funktion. Eine Funktion gibt einem Stück Code zwischen zwei {} einen Namen und ermöglicht es, statt den Code zu wiederholen, einfach den Namen zu benutzen. Man nennt das auch die Funktion aufrufen (zu callen):

Dieses Programm tut genau dasselbe wie oben — aber wir wiederholen uns weniger.

Syntax

Eine Funktion deklarierst du mit dem Schlüsselwort function, gefolgt von einem Namen, runden Klammern () und einem Block {}. Aufrufen tust du sie mit name().

Mit nur 4 Zeilen Funktion und 3 Zeilen Aufruf bekommst du 6 Zeilen Output. Stell dir vor, der Inhalt von sayHello wäre 30 Zeilen lang — die Ersparnis wird schnell groß.

Parameter

Funktionen werden noch viel mächtiger, wenn sie Parameter entgegennehmen können. Das sind Werte, die der Aufrufer der Funktion übergibt:

Mehrere Parameter trennst du mit Kommas:

Function Scope

Wie bei if und while öffnet auch der Funktionskörper einen eigenen Scope. Parameter sind also wie lokale Variablen, die nur innerhalb der Funktion existieren.

return

Bisher haben unsere Funktionen nur console.log benutzt. Viel mächtiger ist es, wenn Funktionen einen Wert zurückgeben — mit dem Schlüsselwort return.

Der Funktionsaufruf wird dann selbst zu einem Wert, mit dem du weiterrechnen kannst:

Noch ein Beispiel — eine Funktion, die den Absolutwert einer Zahl berechnet:

Funktionen als Black Box

Sobald eine Funktion einmal geschrieben ist, kannst du sie benutzen, ohne zu wissen, wie sie intern funktioniert. Du musst nur wissen: was kommt rein, was kommt raus.

Das ist wie bei einem Taschenrechner — du tippst 5 + 3 und siehst 8. Du musst nicht wissen, welche elektronischen Schaltungen drin werkeln.

Diese Idee ist mächtig: andere Leute können Funktionen für dich schreiben, und du benutzt sie als Black Box.

import und export (kurzer Ausblick)

In echten JavaScript-Projekten verteilt man Code auf mehrere Dateien. Damit eine Funktion in einer anderen Datei nutzbar ist, schreibt man export davor:

// foo.js
export function sayHello() {
  console.log("Hallo")
}

In einer anderen Datei importiert man sie:

// bar.js
import { sayHello } from "./foo.js"
sayHello()

💡 In diesem Notebook brauchst du import/export nicht — der ganze Code lebt in derselben Sandbox. Aber: in der Übung unten kannst du export function ... schreiben, um dich an den Stil zu gewöhnen. Die Tests funktionieren genauso.

Übung 🎯 — getMagicNumber

Schreib eine Funktion getMagicNumber(startYear, age), die folgendes macht:

  1. Finde das nächste Jahr ab startYear (inklusive), in dem sowohl die Fußball-EM stattfindet (alle 4 Jahre, beginnend 2020) als auch die Europawahl (alle 5 Jahre, beginnend 2019). Tipp: 2024 war beides.
  2. Berechne, wie alt die Person in diesem Magic-Year sein wird (age plus die Differenz der Jahre).
  3. Starte eine Collatz-Folge mit diesem Alter (gerade → /2, ungerade → 3*n+1).
  4. Returne die dritte Zahl der Folge (also Index 2, wenn man bei 0 zählt — die ersten drei Zahlen sind: das Alter, dann zwei Schritte weiter).
💡 Tipp anzeigen
  • Schritt 1: Du brauchst eine Schleife, die ab startYear hochzählt und prüft, ob das aktuelle Jahr beide Bedingungen erfüllt: (year - 2020) % 4 == 0 und (year - 2019) % 5 == 0.
  • Schritt 3: Drei Zahlen reichen — du musst nicht die ganze Collatz-Folge bis 1 durchlaufen.

Beispiele für korrekte Ergebnisse:

  • getMagicNumber(2024, 30) → 46 (in 2024 ist die Person 30, Collatz: 30 → 15 → 46)
  • getMagicNumber(2018, 18) → 6 (in 2024 ist die Person 24, Collatz: 24 → 12 → 6)
  • getMagicNumber(2035, 5) → 22 (in 2044 ist die Person 14, Collatz: 14 → 7 → 22)

Geschafft! 🚀

Du beherrschst jetzt:

  • Funktionen mit function name() {} deklarieren
  • Parameter und return-Werte
  • Funktionen als Black Boxes verwenden
  • Den Stil von export/import für Mehrdateien-Projekte

Damit hast du Kapitel 2 abgeschlossen! 🎉 Als Nächstes: Arrays →

← Zurück zur Übersicht