0Pricing
TypeScript Academy · Lektion

TypeScript 5.1–5.2: verbesserte Inferenz

Erkunden Sie die Unabhängigkeit von Setter- und Getter-Typen sowie using-Deklarationen.

TypeScript 5.1–5.2: verbesserte Inferenz ist eine kostenlose TypeScript Academy-Lektion auf CoddyKit. Dies ist Lektion 2 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des TypeScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der TypeScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Überblick über TypeScript 5.1

TypeScript 5.1 (veröffentlicht im Juni 2023) verbesserte die unabhängige Typisierung von Setter und Getter, die Flexibilität von JSX-Elementtypen, verknüpfte Cursor in Editoren und die Leistungsoptimierung.

// npm install typescript@5.1

Unabhängige Typen für Setter und Getter

Vor 5.1 mussten Setter und Getter denselben Typ verwenden. Jetzt kann ein Getter einen umfassenderen Typ zurückgeben, als der Setter akzeptiert – nützlich für Muster mit Typkonvertierung.

class Temperature {
  get celsius(): string { return this._c + "°C"; } // string
  set celsius(value: string | number) {             // string | number
    this._c = Number(value);
  }
  private _c = 0;
}

undefined als JSX-Kindelemente

TS 5.1 erlaubt es Komponenten, direkt undefined (zusätzlich zu null) aus ihrer Renderfunktion zurückzugeben, entsprechend dem Verhalten von React 18.

// TS 5.1+: OK
function Widget(): undefined { return undefined; }
// Before 5.1: had to return null or JSX element

Flexibilität beim JSX-Elementtyp

Die neue Einschränkung JSX.ElementType bietet mehr Flexibilität für benutzerdefinierte JSX-Factories und ist für Umgebungen ohne React nützlich.

// Custom JSX element types supported more naturally in 5.1

Überblick über TypeScript 5.2

TypeScript 5.2 (veröffentlicht im August 2023) führte using-Deklarationen (Explizite Ressourcenverwaltung), Decorator-Metadaten und Methoden zum Kopieren von Arrays ein.

// npm install typescript@5.2

using-Deklarationen

using implementiert den Vorschlag zur expliziten Ressourcenverwaltung — die Methode [Symbol.dispose]() der Ressource wird aufgerufen, sobald sie den Gültigkeitsbereich verlässt.

// Requires lib: ["es2022", "esnext.disposable"]
function getConnection(): Disposable {
  const conn = openDb();
  return { [Symbol.dispose]() { conn.close(); } };
}

{
  using conn = getConnection();
  // conn.close() called automatically at block end
}

await using für asynchrone Freigabe

await using funktioniert wie using, ruft jedoch eine asynchrone Methode [Symbol.asyncDispose]() auf und ermöglicht dadurch eine asynchrone Bereinigung.

async function run() {
  await using db = await connectDb();
  // db[Symbol.asyncDispose]() called on exit
}

Decorator-Metadaten

TS 5.2 implementiert den TC39-Vorschlag für Decorator-Metadaten, sodass Decorators über Symbol.metadata Metadaten anhängen können.

function meta(value: string) {
  return (_: unknown, ctx: DecoratorContext) => {
    ctx.metadata[ctx.name] = value;
  };
}

@meta("service")
class MyService {}
console.log((MyService as any)[Symbol.metadata]); // { "MyService": "service" }

Methoden zum Kopieren von Arrays

TS 5.2 fügte Typen für Array.prototype.toSorted, toReversed, toSpliced und with hinzu — unveränderliche Array-Operationen aus ES2023.

const arr = [3, 1, 2];
const sorted = arr.toSorted(); // [1, 2, 3] — new array, arr unchanged
const reversed = arr.toReversed(); // [2, 1, 3]

using in tsconfig für 5.2

Um using-Deklarationen zu verwenden, nehmen Sie die Bibliothek esnext.disposable in Ihre tsconfig auf.

{
  "compilerOptions": {
    "target": "ES2022",
    "lib": ["ES2022", "ESNext.Disposable"]
  }
}

Rückblick: TS 5.1–5.2

TS 5.1: unabhängige Getter-/Setter-Typen und undefined-Rückgaben in JSX. TS 5.2: using-Deklarationen für die automatische Ressourcenbereinigung, Decorator-Metadaten und Typen für unveränderliche Methoden zum Kopieren von Arrays.

Schnelltest

Was bewirkt die using-Deklaration in TypeScript 5.2?

Das haben Sie gelernt

TS 5.1 brachte unabhängige Getter-/Setter-Typen und undefined-Rückgaben in JSX. TS 5.2 führte using-Deklarationen für die automatische Ressourcenverwaltung, Decorator-Metadaten und Typen für unveränderliche Array-Methoden aus ES2023 ein.

Häufig gestellte Fragen

Ist die Lektion „TypeScript 5.1–5.2: verbesserte Inferenz“ kostenlos?

Ja — der vollständige Text von „TypeScript 5.1–5.2: verbesserte Inferenz“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des TypeScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der TypeScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „TypeScript 5.1–5.2: verbesserte Inferenz“?

Erkunden Sie die Unabhängigkeit von Setter- und Getter-Typen sowie using-Deklarationen. Du übst TypeScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um TypeScript Academy zu starten?

Keine Vorkenntnisse erforderlich. TypeScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 2 von 4.

Wie lange dauert die Lektion „TypeScript 5.1–5.2: verbesserte Inferenz“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser TypeScript Academy-Lektion Code schreiben und ausführen?

Ja. Jede TypeScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

  1. TypeScript 5.0: Standard-Decorators und const-Typparameter
  2. TypeScript 5.1–5.2: verbesserte Inferenz
  3. TypeScript 5.3–5.4: neues Narrowing und NoInfer
  4. TypeScript 5.5+: isolierte Deklarationen und mehr
← Zurück zu TypeScript Academy