ECMAScript 6 mit Traceur

Ich bin seit meinem letzten Artikel über TypeScript auf einen anderen Weg gestossen, um neue ECMAScript-Sprachfeatures zu nutzen. Wie ich im Fazit des erwähnten Artikels erwähnt habe, wird sich die Webentwicklung meiner Meinung nach nicht weit von JavaScript wegbewegen. Einen geschickteren Weg, als Heute mit TypeScript zu entwickeln und gegebenenfalls später wieder auf ECMAScript 6 zu wechseln, sehe ich im Traceur Compiler. Traceur wird von Google entwickelt und beispielsweise für die Entwicklung von AngularJS 2 eingesetzt. Der Compiler bietet die Möglichkeit, Sprachfeatures neuerer, noch nicht fertig spezifiziert/vollständig unterstützter JavaScript-Versionen einzusetzen, übersetzt also einfach „JavaScript.next to JavaScript-of-today“.

JavaScript.next, womit momentan grundsätzlich ES6 gemeint ist, bietet einige neue hilfreiche Features und Syntactic Sugar, einige davon habe ich hier grob aufgelistet:

  • const Keyword – für Konstante Variablen
  • let Keyword –für Block- statt Function-Scope Variablen
  • for…of – Iterieren über Collections
  • Iteratoren & Generatoren/yield – Mächtigere Schleifen
  • Arrow Functions – Kürzere Funktions-Schreibweise mit „gespeichertem“ this („Lexical this binding“)
  • Map, Set, WeakMap, WeakSet – Neue Collection-Typen
  • String, Number, Object, Math – Erweiterte Prototypen mit neuen nützliche Methoden
  • Template Strings – Strings mit Platzhaltern für Variablen
  • Symbols, Proxies, Computed Property Names – Erlaubt das dynamische und konfliktlose Erstellen von Methoden und das Einhaken in Methoden für Logging o.ä.
  • Class – Klassen-Syntax
  • Modules, export/import – Modul-Mechanismen, ähnlich CommonJS/AMD
  • Default Parameters – Standardwerte für Funktions-Parameter
  • Rest Parameters, Spread Operators – Variable Arguments, Zerstückeln von Collections zu einzelnen Arguments
  • Deferred functions/Await – Asynchron (& non-blocking) ausgeführte Funktionen

Auch wenn viele der genannten Features noch ändern können, ist ersichtlich, dass der Schritt zu ES6 ein relativ grosser sein wird. Ein paar wenige der Features werden in der aktuellen Firefox-Version bereits unterstützt, da die Spezifikation aber voraussichtlich erst Ende Jahr/Anfang 2015 fertig sein wird, müssen wir, falls wir die Features nutzen wollen, eine Lösung wie den Traceur-Compiler einsetzen. Traceur unterstützt nicht alle bereits spezifizierten Features (Liste), und ändert sich wie die Spezifikation noch ständig.

Wer Heute komplexere JavaScript-Applikationen entwickeln will und einige der Features helfen würden, dem Lege ich ans Herz, sich mit Traceur auseinanderzusetzen. Der Workflow ist relativ einfach aufzusetzen (z.B. via Grunt oder Web-/PhpStorm) und die eingesetzten Features werden in dieser oder ähnlicher Form später von allen Browsern unterstützt, man entwickelt also nicht in einer anderen Sprache, wird jedoch gezwungen mit der Zeit zu gehen und bei einem Traceur-Update ggf. auch sein Produkt zu überarbeiten, falls es Syntax-Änderungen gibt.

https://github.com/google/traceur-compiler – ES6 to ES5 Compiler
https://github.com/Benvie/continuum – ES6 VM

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

*

*

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>