Was ist der Unterschied zwischen Pfeilfunktionen und normalen Funktionen in JavaScript?

1. Syntax:
   • Normale Funktion: function myFunction() { ... }
   • Pfeilfunktion: () => { ... } oder param => { ... }
2. this-Kontext:
   • Normale Funktion: this wird durch den Aufrufkontext bestimmt.
   • Pfeilfunktion: this wird lexikalisch aus dem umgebenden Gültigkeitsbereich geerbt (hat kein eigenes this).
3. Konstruktoren:
   • Normale Funktion: Kann als Konstruktor verwendet werden (new myFunction()).
   • Pfeilfunktion: Kann nicht als Konstruktor verwendet werden.
4. arguments-Objekt:
   • Normale Funktion: Hat ihr eigenes arguments-Objekt mit den übergebenen Argumenten.
   • Pfeilfunktion: Hat kein eigenes arguments-Objekt, Zugriff erfolgt über Rest-Parameter (...args).
5. Benannte Funktionen:
   • Normale Funktion: Kann benannt sein (function myFunction() { ... }).
   • Pfeilfunktion: Standardmäßig anonym, wird einer Variablen zugewiesen (const myFunction = () => { ... }).
6. Implizite Rückgabe:
   • Normale Funktion: Erfordert explizit return, um einen Wert zurückzugeben (außer bei einfachen Fällen wie IIFE).
   • Pfeilfunktion: Bei Ein-Zeilen-Körper kann sie implizit das Ergebnis eines Ausdrucks zurückgeben, ohne return.

Vergleichstabelle:

Merkmal	Normale Funktion	Pfeilfunktion
Syntax	function name() { ... }	() => { ... }
this-Kontext	Dynamisch (abhängig vom Aufruf)	Lexikalisch (vom Elternbereich)
Konstruktoren	Ja	Nein
arguments-Objekt	Ja	Nein (verwendet Rest-Parameter)
Benennung	Kann benannt sein	Anonym (wird zugewiesen)
Implizite Rückgabe	Nein (erfordert meist return)	Ja (bei Ein-Zeilen-Körper)

// Beispiel für normale Funktionen
function standardFunction() {
  console.log(this); // Hängt vom Aufrufkontext ab
  console.log(arguments); // `arguments`-Objekt verfügbar
}

const obj = {
  method: standardFunction
};

standardFunction(); // `this` ist window (im Browser) oder undefined (im Strict-Modus)
obj.method(); // `this` ist obj
new standardFunction(); // `this` ist die neue Instanz

// Beispiel für Pfeilfunktionen
const arrowFunction = () => {
  console.log(this); // Erbt `this` aus dem umgebenden Kontext (z.B. global oder Modul)
  // console.log(arguments); // Fehler, `arguments` nicht verfügbar
};

const outerObj = {
  outerMethod: function() {
    const innerArrowFunction = () => {
      console.log(this); // Erbt `this` von outerMethod (ist outerObj)
    };
    innerArrowFunction();
  }
};

arrowFunction(); // `this` ist window (im Browser) oder {} (in Node.js)
outerObj.outerMethod(); // `this` in innerArrowFunction ist outerObj

// Implizite Rückgabe in Pfeilfunktion
const sum = (a, b) => a + b;
console.log(sum(2, 3)); // 5

// Normale Funktion mit expliziter Rückgabe
function multiply(a, b) {
  return a * b;
}
console.log(multiply(2, 3)); // 6

// Pfeilfunktion kann kein Konstruktor sein
// new arrowFunction(); // Fehler: TypeError: arrowFunction_1 ist kein Konstruktor