Antwort

In TypeScript kann der Typ this in Funktionssignaturen explizit angegeben werden. Dies wird für Methoden von Objekten und Klassen verwendet, um die korrekte Typisierung des Kontextes des Aufrufs zu gewährleisten.

Beispiel für die Angabe des Typs this:

interface Person {
  name: string;
  greet(this: Person): void;
}
const person: Person = {
  name: 'Max',
  greet() {
    console.log(`Hallo, ${this.name}!`);
  }
};

Für Funktionen kann der Typ this explizit angegeben werden – er wird als erster unbenannter Parameter übergeben:

function showName(this: { name: string }) {
  console.log(this.name);
}

Besonderheiten von Pfeilfunktionen:

• Eine Pfeilfunktion hat keinen eigenen Kontext für this. Der Wert von this wird aus dem umgebenden Geltungsbereich übernommen.
• Daher kann der Typ this bei einer Pfeilfunktion nicht explizit angegeben werden – die Signatur wird ignoriert.

Warum ist das nötig? Ermöglicht das Erkennen von Fehlern bei falscher Verwendung von Methoden in Objekten, hilft bei der aktuellen Laufzeit-"Bindung" (zum Beispiel in Event-Handlern).

Fangfrage

Kann man den Typ this bei einer Pfeilfunktion explizit angeben? Wo ist der Haken?

Antwort: Nein. Die Pfeilfunktion erfasst this aus dem äußeren Kontext, und die ECMAScript-Spezifikation sieht keinen eigenen Wert für this innerhalb von ihr vor.

const foo = (this: any) => {} // Kompilierungsfehler

Wenn Sie this kontrollieren müssen – verwenden Sie normale (function) Funktionen.

Beispiele für reale Fehler aufgrund mangelnden Wissens über die Feinheiten des Themas

---

Geschichte

In einer Webanwendung wurden die Methoden der Ereignis-Handler als Pfeilfunktionen mit this geschrieben. Man erwartete, dass TypeScript Bindungsfehler erkennt, aber Pfeilfunktionen haben kein eigenes this. Ergebnis: Verlust des Kontexts, seltsame Fehler bei der Arbeit mit DOM-Handlern.

Geschichte

In Klassen wurden Methoden mit einem expliziten Typ für this über normale Funktionen deklariert, aber beim Weitergeben der Methode als Callback (setTimeout(obj.method, 1000)) ging this verloren, was zu einem Laufzeitfehler führte. Man hatte vergessen, den Kontext über bind oder eine Pfeilfunktion zu fixieren.

Geschichte

In einer Bibliothek zur Arbeit mit Datenmodellen wurde vergessen, den Typ this für die Methoden des Interfaces anzugeben. TypeScript zeigte keinen Fehler bei der falschen Aufruf des Methodes mit einem ungeeigneten Kontext, dafür fiel die Anwendung in der Produktion ab, als auf nicht existierende Eigenschaften zugegriffen wurde.