TypeScript 5.1: Erhöhte Flexibilität bei Property-Zugriffen

Du bist Entwickler und liebst TypeScript? Erfahre mehr über die neuesten Verbesserungen in der Beta-Version von TypeScript 5.1!

Die erste Beta von TypeScript 5.1 ist von Microsoft veröffentlicht worden. Das Update beinhaltet erweiterte Typvorgaben für Getter und Setter sowie Verbesserungen in der Zusammenarbeit mit JSX. Darüber hinaus sind Namespaced Attributes in Kombination mit JSX möglich, und Visual Studio Code bietet gleichzeitiges Bearbeiten zusammengehöriger Tags.

Typenunabhängigkeit für Properties Bis TypeScript 4.2 mussten Getter und Setter für das Auslesen bzw. Setzen von Properties denselben Typ verwenden. In Version 4.3 wurden diese Vorgaben gelockert, sodass get und set unterschiedliche Typdeklarationen verwenden können. Damit kann ein Setter mehrere Typen umwandeln und verarbeiten, während der Getter nur einen Typ zurückgibt.

In früheren Versionen musste der Getter-Typ jedoch für den Setter gültig sein. Dies ist mit TypeScript 5.1 nicht mehr erforderlich. Diese Änderung ermöglicht es, APIs zu verwenden, die für das Auslesen und Setzen von Properties vollkommen unterschiedliche Typen benötigen. Ein Beispiel dafür ist die Property style im Document Object Model (DOM), welche ein CSSStyleDeclaration-Objekt zurückgibt, aber für das Setzen einen String erfordert.

TypeScript 5.1 erlaubt nun passende Getter und Setter, wie dieser Codeausschnitt zeigt:

            // Code in einer Library zum Definieren des
// Attributs im Namespace
namespace JSX {
    interface IntrinsicElements {
        ["a:b"]: { prop: string };
    }
}

// Verwenden des Attributs:
let x = <a:b prop="hello!" />;
        

Neuerungen für JSX Zusammen mit der JavaScript-Syntaxerweiterung JSX bietet das aktuelle Update drei Neuerungen. Erstens können Namespaces für Attribute über JSX.IntrinsicElements definiert werden:

            interface CSSStyleRule {
    // ...

    /** Always reads as a `CSSStyleDeclaration` */
    get style(): CSSStyleDeclaration;

    /** Can only write a `string` here. */
    set style(newValue: string);

    // ...
}
        

Des Weiteren ändern sich die Regeln für die Typprüfung von JSX-Element-Tags. Um gültig zu sein, müssen erstellte bzw. zurückgegebene Typen nicht mehr unbedingt mit JSX.Element kompatibel sein. Stattdessen können gültige Tags in der JSX-Deklaration unter export type ElementType festgelegt werden.

Zusammen mit Visual Studio Code (Insiders) und dem kommenden Visual Studio 17.7 bietet TypeScript für JSX-Tags nun Linked Cursors: Zusammengehörige Tags können im Editor gleichzeitig bearbeitet werden, um den Namen des öffnenden und schließenden Tags einheitlich zu halten. Dafür muss Linked Editing in der Entwicklungsumgebung aktiviert sein.

Undefined ohne Rückgabe In TypeScript 5.1 ist es außerdem möglich, dass Funktionen, die undefined zurückgeben, keine explizite return-Anweisung mehr benötigen. In früheren