
TypeScript ist eine funktionale und objektorientierte optional typisierte Programmiersprache, die zu JavaScript transpiliert wird und zugleich eine Obermenge derselbigen Sprache ist. Als Begründer der Sprache gilt der bei Microsoft angestellte dänische Software Engineer Anders Hejlsberg, der auch maßgeblich C# mitgestaltet hat.
Nach zwei Jahren Entwicklungszeit wurde TypeScript im Jahr 2012 unter der Version 0.8 das erste Mal der Öffentlichkeit zugänglich gemacht. Die Version 1.0 erschien im Jahr 2014. Im gleichen Jahr ist der Quellcode von TypeScript zu GitHub umgezogen.
Alleinstellungsmerkmale
JavaScript war in seiner Anfangszeit nicht dafür konzipiert, Enterprise-Anwendungen zu bauen. Durch die Einführung eines Typensystems kompensiert TypeScript dies und schafft eine Sprache, mit der sich auch große Projekte mit einer Vielzahl von Entwicklern gut umsetzen lassen.
Zwar gibt es auch andersweitige Bestreben wie JSDoc und Flow, JavaScript um Typinformationen zu erweitern, im Unterschied zu TypeScript hat sich aber keine der Alternativen weitläufig durchsetzen können.
Einsatzbereiche
Die IDE Visual Studio Code, die Frameworks Angular, Circle.js, Ionic, Nestjs und Vue.js, die reaktive JavaScript-Erweiterung RxJS, die Testbibliothek Jest und die Echtzeit-3D-Engine Babylon.js sind überwiegend in TypeScript geschrieben. Viele bekannte JavaScript-Frameworks unterstützen TypeScript neben JavaScript. Diverse NPM-Pakete bieten zusätzliche Typeninformationen für die Einbindung in TypeScript-Code.
Pros
TypeScript bringt die wesentlichen Vorteile in seinen Design Goals auf den Punkt. Das Typensystem, durch das sich TypeScript auszeichnet, liefert zusätzliche Kontextinformationen und gibt bessere Strukturierungsmöglichkeiten für große Codebasen als reines JavaScript. IDEs können Entwickler durch die Typinformationen besser unterstützen, etwa mit Warnungen oder Refactoring-Möglichkeiten. Die zusätzliche Typsicherheit erhöht die Wartbarkeit und ermöglicht eine leichtere Skalierung, auch können gegenüber JavaScript potenziell weniger Fehler entstehen.
TypeScript hat unter anderem als Design-Ziele formuliert, auf Breaking Changes nach Möglichkeit zu verzichten und keine unkonventionellen Syntaxkonstrukte einzuführen, womit sich TypeScript gut für den kommerziellen Einsatz eignet.
Die Sprache ist leicht zu erlernen, da die Syntaxerweiterungen gegenüber JavaScript sich an anderen populären Sprachen orientieren. Gleichzeitig profitiert TypeScript von dem riesigen Ökosystem und der ebenso großen Community von JavaScript. TypeScript selbst ist mittlerweile so verbreitet, dass es von den gängigen JavaScript-Frameworks gute Unterstützung erfährt und es kein Problem ist, Entwickler mit TypeScript-Kenntnissen zu finden.
Zwar implizieren zusätzliche Typinformationen erstmal mehr Code, durch eine gute Typinferenz kann aber auf explizite Deklaration verzichtet werden, wenn der Typ eindeutig abgeleitet werden kann, etwa bei Variablen und Rückgabewerten von Funktionen.
TypeScript bietet neben Interfaces und Generics eine Menge zusätzlicher Hilfstypen, die gut zum prototypenbasierten Ansatz von JavaScript passen, etwa die Typen Partial, Required und Readonly, die alle Attribute einer Klasse entsprechend optional, verbindlich oder immutable machen. Die Verwendung einiger weiterer Typen demonstriert der nachfolgende Code:
interface Foo {
a: string
b: string
c: string
}
type PickFoo = Pick<Foo, "a" | "b">
let a: PickFoo = { a: "a", b: "b" } // compiles
a = { a: "a", b: "b", c: "c" } // compile error
type OmitFoo = Omit<Foo, "a">
let b: OmitFoo = { b: "b", c: "c" } // compiles
b = { a: "a", b: "b", c: "c" } // compile error
type Bar = string | number | undefined
type ExcludeBar = Exclude<Bar, string>
let c: ExcludeBar = 1 // compiles
c = undefined // compiles
c = "" // compile error
type NonNullableBar = NonNullable<Bar>
let d: NonNullableBar = 1 // compiles
d = "" // compiles
d = undefined // compile error
Typdefinitionen in TypeScript können aber nicht nur auf bestehenden Typen aufsetzen, sondern auch ein ganz bestimmtes Set von Werten vorgeben. Damit lässt sich ganz hervorragend typsicherer Code bauen, um CSS-Properties zu setzen, wie das folgende Beispiel verdeutlicht:
type FontSize = 'small' | 'medium' | 'large'
const a: FontSize = 'small' // compiles
const b: FontSize = 'smaller' // compile error
Wie mächtig das Typensystem von TypeScript wirklich ist, wird einem am ehesten klar, wenn man einen Blick in TypeScript-Frameworks wie React wirft.
Cons
Als Obermenge von JavaScript erhöht TypeScript die Komplexität, da es insgesamt mehr Syntax gibt. Da gängige Webbrowser nur JavaScript unterstützen, erhöht TypeScript zugleich die Komplexität des Build-Prozesses, da es immer zu JavaScript transpiliert werden muss.
TypeScript kann ein falsches Gefühl der Sicherheit vermitteln, da die Typsicherheit leicht ausgetrickst werden kann. Dies ist eine bewusste Design-Entscheidung und als Nicht-Ziel in den Design-Zielen formuliert. Der folgende Code verdeutlicht, wie aus einer vermeindlichen String
-Property eine Number
werden kann:
interface Foo {
a: string
}
interface Bar {
a: string | number
}
let x: Foo = { a: "foo" }
let y: Bar = x
y.a = 42
console.log(typeof x.a, x.a)
// Ausgabe: "number 42"
Datenblatt
Name | TypeScript |
Webseite | https://www.typescriptlang.org/ |
Erscheinungsjahr | 2012 |
Aktuellste Version (Stand 14. April 2024) | 5.3.3 |
Typisierung | optional statisch |
Paradigmen | funktional, objektorientiert |
Pros | Cons |
---|---|
grundsätzliche Typsicherheit | Typsicherheit kann ausgehebelt werden |
potenziell bessere Wartbarkeit und Skalierbarkeit (gemeinsame Arbeit an großen Codebasen) sowie geringere Fehleranfälligkeit als JavaScript | komplexere Syntax als JavaScript, da Obermenge |
Vermeidung von Boilerplate Code durch Typinferenz | komplexerer Build-Prozess, da zu JavaScript transpiliert |
leicht zu erlernen | |
formuliertes Ziel auf Breaking Changes möglichst zu verzichten | |
Zugriff auf JavaScript-Ökosystem | |
Zugriff auf JavaScript-Community |
virtuallet
virtuallet ist ein kleines Programm von mir, welches ich in diversen Programmiersprachen implementiert habe. Hier geht es direkt zum TypeScript-Code von virtuallet auf GitLab. Hier gibt es weitere Infos zu virtuallet.
- Design-Ziele von TypeScript