Upgrade to Pro — share decks privately, control downloads, hide ads and more …

EKON 20: TypeScript

EKON 20: TypeScript

My slides for my EKON 20 session about TypeScript

Sebastian Gingter

November 08, 2016
Tweet

More Decks by Sebastian Gingter

Other Decks in Technology

Transcript

  1. Sebastian P.R. Gingter @PhoenixHawk Consultant & Software Engineer TypeScript Das

    JavaScript für Delphianer EKON 20, November 2016, Düsseldorf
  2. Sebastian P.R. Gingter @PhoenixHawk Consultant & Software Engineer EKON 20,

    November 2016, Düsseldorf TypeScript Das JavaScript für Delphianer
  3. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Warum ist das für mich relevant? “I’ve said a million times that I’ve said a million times that Javascript is the new Assembler – that Javascript will become the thing that everyone compiles higher level code into.“ - Nick Hodges, Oct. 2012 JavaScript?!?
  4. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Warum ist das für mich relevant? • Sprache des Internets • Läuft auf wirklich jedem Gerät • vom PC, Routern, NAS-Systemen, Tablets, Smartphones • über Wearables, Konsolen, Fernsehern, • bis hin zu Arduinos, Raspberry Pi‘s, IOT-Geräten, Heim-Automatisierung etc. • Viele Desktop- und Mobile Anwendungen sind schon heute in JS geschrieben • Atom Editor, VS Code, Slack, Spotify, GitKraken, Wordpress Desktop App, Ghost, Hyper terminal, Gitbook, Discord, Postman etc. JavaScript?!?
  5. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Ja, wo laufen sie denn? • Wo läuft denn JavaScript konkret? • Client: Browser • Server / Backend: Node.js • Electron (Node + Browser gebundelt) • In anderen Prozessen (RO Script, Edge…) • Datenbanken • CouchDB, Mongo, PouchDB JavaScript!
  6. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Eine kleine historische Reise • Gestartet als LiveScript im Netscape Navigator 2.0, Sept. 1995 • By Brendan Eich • JavaScript 1.1 in Netscape Navigator 3.0, April 1996 • „Jscript“ in Internet Explorer 3, Mai 1996 • Beginn des Browserkriegs • JavaScript 1.3, Oktober 1998, ECMA-262 1st & 2nd Edition • Auch ISO/IEC 16262 • JavaScript 1.5, November 2000, ECMA-262 3rd Edition (1999) JavaScript
  7. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Eine kleine historische Reise • ECMAScript 4 – Standardisierung wurde 2008 abgebrochen • ECMAScript 5 (aka ECMAScript 3.1), Dezember 2009 • Minimales Update von ECMAScript 3, JS 1.5 • ECMAScript 2015 (aka ECMAscript 6th Edition), Juni 2015 • ECMAScript 2016 , (aka ECMAScript 7th Edition), (in Arbeit) JavaScript
  8. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Nicht ganz so einfach… • ES 5: So gut wie überall (ab IE 11+, Ausnahmen z.B. Konqueror, Rhino) • http://kangax.github.io/compat-table/es5/ • ES 6: Node 6.5, Edge, neuere FF, Chrome ab 54 • http://kangax.github.io/compat-table/es6/ • ES 2016: Node 6.5, Edge, FF52 beta, Chrome ab 56 (beta) • Aber: Features fehlen noch überall • http://kangax.github.io/compat-table/es2016plus/ Support
  9. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Nur die größten • Tippfehler führen zu Laufzeitfehlern • Keine Modularisierung (Includes / Usings) • Funktionale Programmierung „this“ zeigt in Callbacks auf Objekte, die man nicht erwartet • Prototypische Vererbung ist…. mindestens Gewöhnungsbedürftig JavaScript Probleme
  10. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Einige… • Transpiler • CoffeeScript • Google‘s Closure Compiler • TypeScript Lösungsansätze
  11. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Weil alle Coolen Kids das nehmen  Warum TypeScript ?
  12. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Was ist das genau? • Entwickelt von Anders Hejlsberg bei Microsoft • Released 2012 • Reines JavaScript • Basis: ECMAScript 2015 • Plus optionale(!) Typisierung • Plus (vorwärtskompatible) Spracherweiterungen • Open Source Transpiler (in TS geschrieben) • Von TS auf ES3, ES2015 und neu auch ES2016 • Transpiler ist vor allem ein “Typlöscher“ TypeScript
  13. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Was ist das genau? • Sprachfeatures • Typsicherheit • OOP • Konstruktoren • Ableitungen • Interfaces • Function overloading • Statische- und Instanz-Member • Module TypeScript
  14. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Starten in 1… 2… 3… Voraussetzungen: • Node.js (JS Ausführungsumgebung) • Text-Editor der Wahl, z.B. VS Code oder Atom npm i typescript -g tsc Hinweis: Globale Installation von Node-Modulen sollte vermieden werden. Dies hier ist nur ein quick-start Beispiel. TypeScript
  15. EKON 20, November 2016 TypeScript – Das JavaScript für Delphianer

    Quellen: Kontakt: • https://nodejs.org • https://www.typescriptlang.org/ • http://code.visualstudio.com/ • [email protected] • @PhoenixHawk Vielen Dank! Fragen? Antworten!