JavaScript — Grundlagen
Kapitel 3 · Theorie

Funktionen, Arrow & Closures

Drei Funktions-Syntax-Varianten

// 1. Function Declaration (gehoistet)
function add(a, b) { return a + b; }

// 2. Function Expression (nicht gehoistet)
const sub = function(a, b) { return a - b; };

// 3. Arrow Function (knapp, kein eigenes 'this')
const mul = (a, b) => a * b;
const square = x => x * x;       // einzelnes Argument: keine Klammern

Arrow vs. Function — der this-Unterschied

const obj = {
  zahl: 42,
  zeigeFunc: function() { console.log(this.zahl); }, // 42
  zeigeArrow: () => console.log(this.zahl),          // undefined
};
obj.zeigeFunc();
obj.zeigeArrow();

Arrow-Funktionen erben this aus dem umgebenden Scope. Bei Methoden auf Objekten meistens NICHT was du willst.

Closures — Funktion behält Zugriff auf Scope

function counter() {
  let count = 0;
  return () => ++count;
}
const c = counter();
c();   // 1
c();   // 2
c();   // 3
// count ist privat, nur via c() erreichbar

Higher-Order Functions

const zahlen = [1, 2, 3, 4, 5];
const quadrate = zahlen.map(x => x * x);          // [1, 4, 9, 16, 25]
const gerade = zahlen.filter(x => x % 2 === 0);   // [2, 4]
const summe = zahlen.reduce((a, b) => a + b, 0);  // 15
Zurück zu Informatik