EMZETT.
Login

Kurz: Eine Funktion ist ein benannter Codeblock, den du beliebig oft aufrufen kannst. Sie vermeidet Wiederholungen und gliedert dein Programm.

Teil des Kurses JavaScript

Kapitel 10 von 40 im Kurs JavaScript (Abschnitt „Funktionen“). Mit Fortschritt, Quiz und Zertifikat auf der Lernseite.

Eine Funktion ist ein benannter Codeblock, den du beliebig oft aufrufen kannst. Sie vermeidet Wiederholungen und gliedert dein Programm.

Definition und Aufruf

function begruessen(name) {
  return "Hallo " + name + "!";
}
console.log(begruessen("Mia"));
console.log(begruessen("Tom"));

Ausgabe:

Hallo Mia!
Hallo Tom!
  • function leitet die Definition ein, danach kommen Name, Parameter in ( ) und der Rumpf in { }.
  • return gibt einen Wert zurück und beendet die Funktion. Ohne return gibt sie undefined zurück.
  • Parameter stehen in der Definition, Argumente beim Aufruf.

Mehrere Parameter und Standardwerte

function potenz(basis, exponent = 2) {
  return basis ** exponent;
}
console.log(potenz(5));
console.log(potenz(2, 10));
 
function kaffee(groesse = "mittel", mit = "Milch") {
  return `${groesse} mit ${mit}`;
}
console.log(kaffee(), "|", kaffee("klein"), "|", kaffee(undefined, "Hafermilch"));

Ausgabe:

25
1024
mittel mit Milch | klein mit Milch | mittel mit Hafermilch

Rest-Parameter

Mit ... fängst du beliebig viele Argumente als Array:

function summe(...zahlen) {
  let s = 0;
  for (const z of zahlen) s += z;
  return s;
}
console.log(summe(1, 2, 3), summe(), summe(10, 20, 30, 40));
console.log(Math.max(...[3, 9, 2]));    // Spread: Array als Argumente

Ausgabe:

6 0 100
9

Funktionsausdrücke

Funktionen sind Werte: Du kannst sie in Variablen speichern, übergeben und zurückgeben.

const quadrat = function (x) { return x * x; };
console.log(quadrat(7));
 
function wendeAn(f, wert) { return f(wert); }
console.log(wendeAn(quadrat, 5));
console.log(wendeAn(Math.sqrt, 81));
console.log(typeof quadrat, quadrat.name, quadrat.length);

Ausgabe:

49
25
9
function quadrat 1

Funktionen mit Objekt als Parameter

Bei vielen Parametern ist ein Objekt mit Namen lesbarer als eine lange Liste:

function benutzer({ name, alter = 18, rolle = "Gast" }) {
  return `${name} (${alter}, ${rolle})`;
}
console.log(benutzer({ name: "Mia" }));
console.log(benutzer({ name: "Tom", rolle: "Admin", alter: 30 }));

Ausgabe:

Mia (18, Gast)
Tom (30, Admin)

Mehrere Werte zurückgeben

Eine Funktion liefert einen Wert. Für mehrere gibst du ein Array oder Objekt zurück und zerlegst es:

function minMax(zahlen) {
  return { min: Math.min(...zahlen), max: Math.max(...zahlen) };
}
const { min, max } = minMax([4, 9, 1, 7]);
console.log(min, max);

Ausgabe:

1 9

Hoisting

Funktionsdeklarationen werden “nach oben gezogen”: Du kannst sie schon vor ihrer Zeile aufrufen. Bei const f = function... geht das nicht.

console.log(hallo());          // funktioniert
function hallo() { return "bereits da"; }

Ausgabe:

bereits da

Rekursion

Eine Funktion kann sich selbst aufrufen. Es braucht immer eine Abbruchbedingung:

function fakultaet(n) {
  if (n <= 1) return 1;
  return n * fakultaet(n - 1);
}
console.log(fakultaet(5), fakultaet(10));
const fib = (n) => (n < 2 ? n : fib(n - 1) + fib(n - 2));
console.log(fib(15));

Ausgabe:

120 3628800
610

Reine Funktionen

Eine reine Funktion liefert bei gleicher Eingabe immer dasselbe Ergebnis und ändert nichts außerhalb. Solche Funktionen sind leicht zu testen und zu verstehen.

Merke

  • function name(parameter) { return wert; }
  • Ohne return ist das Ergebnis undefined
  • Standardwerte (x = 1), Rest-Parameter (...args), Objekt-Parameter
  • Funktionen sind Werte und können übergeben werden
  • Rekursion braucht eine Abbruchbedingung

Übungsaufgabe

Schreibe eine Funktion istPrimzahl(n) und gib alle Primzahlen bis 50 aus.

Quiz zur Selbstkontrolle

Weiter im Kurs

Zurück: Schleifen

Weiter: Arrow-Funktionen

Alle Kapitel: JavaScript im Überblick