Was ist eigentlich TypeScript?

TypeScript etabliert sich zur neuen Standard-Programmiersprache im Webfrontend. In diesem Blogpost möchte ich die Herkunft und die Grundlagen dieser Sprache, sowie die Vorteile und Unterschiede gegenüber JavaScript erläutern.

Was ist ECMAScript?

Bevor wir über TypeScript reden, muss erklärt werden, woher die Spezifikation von TypeScript kommt. Die ECMAScript-Spezifikation wird seit jeher von der European Computer Manufacturers Association festgelegt und definiert quasi, wie JavaScript funktioniert.
Die ECMA-Organisation beschäftigt sich jedoch nicht nur mit JavaScript, sondern auch mit anderen Standards, wie z.B. die gute alte CD-ROM, die Floppy-Disk oder das Office-Open-XML-Format. Hier eine Liste aller ECMA-Standards).

ECMA-Script (kurz ES) wird – seit 2015 – jedes Jahr im Juni neu Released und trägt auch den entsprechenden Jahresnamen in der Spezifikation. Die aktuelle Version ist z.B. ECMAScript 2017.
Aber Vorsicht (!) ECMAScript 2017 heißt in der Kurzform ES8 oder ECMAScript 8 (für 8th Edition) – ziemlich verwirrend, oder?

Versionsname (kurz) Versionsname (lang) Name der Spezifikation Signifikanteste Änderungen
ES6 ECMAScript 6 ECMAScript 2015 Added classes and modules.
ES7 ECMAScript 7 ECMAScript 2016 Added exponential operator (**). Added Array.prototype.includes.
ES8 ECMAScript 8 ECMAScript 2017 Async Functions, Shared memory and atomics.
ES.Next Generischer Name für die nächste, kommende Spezifikation.

JavaScript ist also nichts weiter, als eine Implementierung der ECMAScript Spezifikation.
Was ist mit dem Browser-Suppport? Siehe: caniuse.com/#search=ES6 oder w3schools.com/js/js_versions.asp

Was ist TypeScript?

TypeScript (kurz: TS) ist ein Superset von JavaScript. Das bedeutet, TS ist ebenfalls eine Implementierung von ECMAScript, erweitert aber JavaScript mit zusätzlichen „Features“.
Jeder JavaScript-Code funktioniert auch in TypeScript, aber nicht jeder TypeScript-Code funktioniert auch in JavaScript.

Wie der Name schon verrät, erweitert TypeScript JavaScript um Typings (und Annotations). Das heißt die Programmiersprache ist Typsicher – wie z.B. auch Java oder C#.
Hier ein Beispiel zur Verdeutlichung:

JavaScript TypeScript
var companyName= "doubleSlash"; let companyName: string = "doubleSlash";

Die Typsicherheit unterstützt in erster Linie den Entwickler und resultiert somit in einer höheren Code-Qualität, obwohl am Ende die Software in einer „alten JavaScript-Umgebung“ lauffähig ist. Durch statische Codeanalyse kann die Softwarequalität noch weiter gesteiert werden.

Die Typings gehen nach dem Kompilieren verloren (da JavaScript keine Typings kennt) und müssen eigentlich gar nicht genutzt werden. Sie sind laut TS-Spezifikation optional (beim Thema Clean Code sind sie natürlich Mandatory!).
Auf der Homepage typescriptlang.org heißt es übrigens: „TypeScript – JavaScript that scales.„.

Aber nicht nur das: Die von Microsoft entwickelte Sprache kompiliert TypeScript-Code „herunter“ zu einer (fast) beliebigen Ziel-ECMAScript Definition (JavaScript-Version), z.B. ES5 – was von so gut wie allen Browsern unterstützt wird. Dies kann in den Compiler-Options (tsconfig.json) konfiguriert werden. Das bedeutet, in der produktiven Webapp läuft am Ende immernoch JavaScript im Browser, kein TypeScript.
Somit schafft TypeScript in Webfrontend-Projekten auch eine gewisse Browser-Unabhängigkeit, da der/die Entwickler/in sich nicht mehr darum kümmern muss, welche ECMAScript-Features er in welchen Browsern verwenden darf, und welche nicht.

Wie der Code nach der Kompilierung aussieht, kann hier live ausprobieren:

FAQ zu TypeScript

  • Gibt es auch Browser, die TypeScript direkt verstehen (ohne Kompiliervorgang zu JavaScript)?
    → Ja, z.B. Firefox, Chrome oder sogar der IE ab Version 11! Dadurch ist es z.B. möglich über die sog. Source-Maps den TypeScript-Code direkt im Browser zu debuggen.
  • Gibt es auch Konkurrenz zu TypeScript?
    → Ja, z.B. Flow von Facebook – kann im Prinzip genau das gleiche.
  • Mit welchen Frameworks kann ich TypeScript nutzen?
    → Mit so gut wie allen aktuellen, z.B. Angular, React, Electron, Ionic, …

 

Zusammenfassung (tl;dr)

  • die Benamung der ECMAScript Spezifikationen ist äußerst kompliziert und verwirrend
  • TypeScript ist eine Implementierung der ECMAScript-Spezifikation und erweitert JavaScript um Typen, Annotationen und mehr (Superset von JS)
  • man kann als Faustregel sagen, TypeScript ist der aktuellen ECMAScript Spezifikation immer etwas vorraus.
  • der TypeScript Compiler ermöglicht es, zu einer bestimmten Target-Language (JavaScript-Version) zu kompilieren, z.B. ES5 → Stichwort „Browser-Unabhängigkeit“.
  • Debugging von TypeScript ist über Source-Maps direkt im Browser möglich

 

Mehr zum Thema Webfrontend Entwicklung erfahren

Wussten Sie schon, was Microservices sind?

Die fortschreitende Digitalisierung zwingt Unternehmen dazu, flexibel auf Marktanforderungen zu reagieren und ihre Time-to-Market zu verkürzen. Große, monolithische Softwaresysteme können dieser Flexibilität oft nicht mehr standhalten. Eine Microservice Architektur bildet fachliche Funktionen in eigenständigen Modulen ab und vermeidet so unflexible Monolithen.

Wir haben bei unserem Senior Software Architect Marc Mai nachgefragt, wie Microservices funktionieren.

Wie funktionieren Microservices?

Microservices bilden die fachlichen Funktionen in eigenständigen Modulen ab. Im Gegensatz zu einem monolithischen Ansatz wird dabei „der Elefant in kleine Teile geschnitten“. Das vereinfacht Entwicklung, Betrieb und Wartung. Technologische Abhängigkeiten werden verringert, da pro Microservice ein eigener Technologiestack verwendet werden kann. Die Frage „Welche Technologie passt zu meiner Anforderung?“ rückt in den Vordergrund. Für Entwickler bedeutet das allerdings, dass sie gegebenenfalls mehr unterschiedliche Technologien und deren Tools beherrschen müssen.

Was haben Unternehmen dadurch für Vorteile?

Das Credo lautet: Ein Microservice, eine Funktion. Man wird kleiner, schneller und flexibler.
Ein Entwicklungsteam kann sich ganzheitlich um den Service kümmern, was die Effizienz der Entwicklung und des Betriebes enorm steigert (Stichwort „DevOps“). Services sind leichter zu überblicken und neue Entwickler lassen sich schneller einbeziehen. Es kann zielgerichteter skaliert werden, da mehrere Instanzen eines kompakten Services schnell und einfach auf mehrere Server verteilt werden können. Als Letztes sollte man an den Lebenszyklus einer Software denken. Kleine Elemente lassen sich viel leichter austauschen bzw. ablösen als ein Monolith – das spart Zeit und Kosten.

Wie entwickeln sich Microservices weiter?

Aktuell sind Microservices ein Hype. Dabei ist es wie mit jeder neuen Technologie: Mit der Zeit wird sich herausstellen, für welche Szenarien Microservices besonders gut geeignet sind und für welche nicht. Ziel muss sein, durch Weiterentwicklung von entsprechenden Werkzeugen maximale Einfachheit und Automatisierung zu erreichen – das spart Entwicklungskosten.
Gerade im IoT-Kontext sind Microservices besonders wichtig, weil einerseits durch die zunehmende Zahl an Geräten deutlich mehr Dynamik und Skalierbarkeit gefordert ist und andererseits ständig neue Funktionen hinzu- kommen.


Marc Mai Business Consultant und Microservices Experte doubleSlashMarc Mai hat Wirtschaftsinformatik (M.Sc.) studiert und ist seit 2013 bei doubleSlash als Software Architect tätig. Er hat branchenübergreifende Erfahrungen in IT-Projekten, auch im Bereich Automotive, z.B. mit der BMW AG. Marc Mai ist Experte für Java-EE, IoT und Big Data. Sein Einsatzschwerpunkt ist die Konzeption, Erstellung und Optimierung von Backend-Systemen und deren Architekturen.

 

 

 

Augmented Reality (AR): Was ist hier der aktuelle Status Quo?

In den letzten Jahren ist immer wieder das Thema Augmented Reality (AR) in den Medien aufgetaucht und die Technologie als absoluter Hype vermarket worden. Besonders Pokémon Go und Snapchat Filter machten das Thema rund um AR populär. In letzter Zeit war jedoch wieder weniger von AR zu hören. Es stellt sich die Frage, welches Potential diese Technologie um die erweiterte Realität bietet. Da auch bei doubleSlash Augmented Reality und Virtual Reality (RA) Applikationen für IoT Programme entwickelt werden, haben wir das Thema ständig im Blick.1

Mehr

what3words – Revolutionäres Kartenmaterial?

Ein neues Konzept der Kartografie, genannt what3words, wurde jüngst von einem britischen Startup entworfen. Die neue Methode verspricht eine bessere Interaktion von Menschen mit technischen Geräten, was gleichzeitig für weniger Fehler und präzisere Angaben sorgen soll. Die Frage ist jedoch: Lohnt sich der Aufwand der Umstellung oder ist das verschwendete Zeit?Mehr

Was ist eine progressive Web App?

Progressive Web Apps (kurz: PWA) sind im Webfrontend-Bereich das Buzzword 2018. Genauer gesagt existiert der Begriff progressive Web App schon seit mehreren Jahren. Jedoch ist vielen noch nicht klar, um was es sich dabei handelt. Oft werden responsive Webapps damit in Verbindung gebracht – doch wie hängen diese beiden Paradigmen zusammen? Und welche Technologien werden für progressive Web Apps benötigt? Diese und weitere Fragen möchte ich in diesem Beitrag beantworten.

Mehr