Es ist immer wieder interessant, wenn die Entwickler von TypeScript ihre neueste Version ankündigen. Und dieses Mal ist es nicht anders. In diesem Artikel werde ich euch zeigen, was neu ist und was in TypeScript 5.1 verbessert wurde!

Einfachere implizite Rückgaben für undefined-Rückgabefunktionen #

TypeScript 5.1 hat es noch einfacher gemacht, mit Funktionen zu arbeiten, die undefined zurückgeben. Jetzt müssen nicht mehr alle Codepfade in einer expliziten return-Anweisung enden, wenn Sie die --noImplicitReturns-Option verwenden. Hier ist ein kurzes Code-Beispiel, um das zu veranschaulichen:

// ✅ Funktioniert in TypeScript 5.1!
function f1(): undefined {
  // kein return erforderlich
}
// ✅ Funktioniert in TypeScript 5.1 unter '--noImplicitReturns'!
function f2(): undefined {
  if (Math.random()) {
    // tue etwas...
    return;
  }
}

Getters und Setters können nun unterschiedliche Typen haben #

Bisher musste der Typ des get-Accessors ein Subtyp des set-Accessors sein. Jetzt können get und set Zugriffssteuerungspaare vollkommen unterschiedliche Typen haben, vorausgesetzt, sie haben explizite Typen-Annotationen. Betrachten Sie das folgende Beispiel:

interface Serializer {
  set value(v: string | number | boolean);
  get value(): string;
}

declare let box: Serializer;

// Ermöglicht das Schreiben eines 'boolean'
box.value = true;

// Kommt als 'string' heraus
console.log(box.value.toUpperCase());

Unterstützung für Namensräume in JSX-Attributen #

TypeScript unterstützt nun namensbezogene Attributnamen bei der Verwendung von JSX. Dies kann sowohl bei Attributnamen als auch bei JSX-Tag-Namen verwendet werden. Hier ist ein kurzes Beispiel:

import * as React from "react";

// Beide sind äquivalent:
const x = <Foo a:b="hello" />;
const y = <Foo a : b="hello" />;

interface FooProps {
    "a:b": string;
}

function Foo(props: FooProps) {
    return <div>{props["a:b"]}</div>;
}

typeRoots werden jetzt in der Modulauflösung berücksichtigt #

Wenn TypeScript's festgelegte Modul-Lookup-Strategie einen Pfad nicht auflösen kann, werden nun Pakete relativ zu den angegebenen typeRoots aufgelöst.

Verknüpfte Cursor für JSX-Tags #

TypeScript unterstützt jetzt verknüpfte Bearbeitung für JSX-Tag-Namen. Dies ermöglicht es einem Editor, mehrere Orte gleichzeitig automatisch zu bearbeiten. Dieses neue Feature kann in den Visual Studio Code Einstellungen aktiviert werden:

{
  // ...
  "editor.linkedEditing": true
}

Snippet-Autovervollständigungen für @param JSDoc-Tags #

TypeScript bietet jetzt Snippet-Autovervollständigungen an, wenn Sie ein @param-Tag in TypeScript- und JavaScript-Dateien eingeben.

Optimierungen #

Unnötige Typeninstanziierung vermeiden #

TypeScript 5.1 vermeidet nun das Durchführen von Typeninstanziierungen innerhalb von Objekttypen, von denen bekannt ist, dass sie keine Verweise auf äußere Typparameter enthalten. Dies hat das Potenzial, viele unnötige Berechnungen zu reduzieren und die Typenprüfungszeit des Verzeichnisses docs von material-ui um über 50% zu reduzieren.

Negative Case Checks für Union Literals #

Bei der Überprüfung, ob ein Quelltyp Teil eines Union-Typs ist, führt TypeScript zuerst eine schnelle Suche mit einem internen Typ-Identifikator für diese Quelle durch. Wenn diese Suche fehlschlägt, dann prüft TypeScript auf Kompatibilität gegen jeden Typ innerhalb der Union. Wenn ein Literal-Typ mit einer Union aus reinen Literal-Typen in Beziehung gesetzt wird, kann TypeScript nun diesen vollen Durchlauf gegen jeden anderen Typ in der Union vermeiden. Diese Optimierung konnte die Typenprüfungszeit des Codes in diesem Issue von etwa 45 Sekunden auf etwa 0,4 Sekunden reduzieren.

Das sind also die neuen Funktionen und Verbesserungen in TypeScript 5.1. Es sieht so aus, als ob die diese neuen Features zweifellos dazu beitragen werden, die Entwicklungserfahrung zu verbessern und produktiver zu machen. Mehr Informationen und einige neue Sachen, die ich nicht erwähnt habe, findet ihr in der offiziellen Ankündigung.