Types everywhere!

Types everywhere!

Presentation made at a meetup organized by MugInClermont, LavaJUG and Clermont'ech!

Abstract (in French):
L’engouement autour de TypeScript ne cesse de croitre depuis la version 2.0. En quelques mois, le langage est devenu un incontournable dans les entreprises, mais aussi dans la communauté open source. Au départ considéré comme un énième langage, il a atteint depuis quelques semaines le score symbolique du million de téléchargement journalier sur NPM, le gestionnaire de packages de Node.js.

Comment TypeScript en est-il arrivé là ?

C’est grâce à un système de typage particulièrement avancé qu’il s’est taillé la réputation d’être puissant, pragmatique et fiable ! Ces nombreuses qualités masquent parfois une certaine complexité qui, si mal maîtrisée, peuvent en décourage plus d’un ! C’est pourquoi dans cette présentation, après une introduction sur le langage, nous nous pencherons sur certaines capacités de TypeScript autour de la manipulation des types.

Live coding source are available on github: https://github.com/spontoreau/typescript-typesystem

9298dcce5b2b0e88d8ffbb837192ca98?s=128

Sylvain Pontoreau

March 21, 2019
Tweet

Transcript

  1. Mug in Clermont | LavaJUG | Clermont'ech, March 2019

  2. Premier Field Engineer @spontoreau In ❤️ with Co-organizer

  3. @ParisTypeScript

  4. None
  5. https://github.com/Microsoft/TypeScript

  6. None
  7. transpile ts js $ tsc config

  8. Editors tsserver server.ts Language Service service.ts TS standalone compiler tsc.ts

    Core TypeScript Compiler core.ts, emitter.ts, checker.ts, parser.ts, …
  9. { "name": "angular-with-dts", "version": "1.0.0", "dependencies": { "angular": "1.5.8" },

    "devDependencies": { "@types/angular":"1.5.20" } } $ npm install --save-dev @types/angular package.json:
  10. None
  11. None
  12. let str: string; let array: number[] = [1, 2, 3];

    function fn(param: boolean): void { // Do something }
  13. interface Rocket { boosters: number; launch: () => void; }

    class Soyuz implements Rocket { boosters : number; constructor() { this.boosters = 4; } launch(): void { … }; } let soyuzT15: Rocket = new Soyuz(); let soyuzMS3: Soyuz = new Soyuz(); Class or Interface… How to choose?
  14. any

  15. class Rocket { name: string; boosters: number; } class Cat

    { name: string; } function playWithKitten(kitten: Cat) { // Do something } const rocket: Rocket = { name: "Soyuz", boosters: 4 }; const cat: Cat = { name: "Grumpy" }; playWithKitten(cat); playWithKitten(rocket); // ☺
  16. • TypeScript is JavaScript. • Interface is only a TypeScript

    compiler concept (type checking). • Sometime you have to deal with the any type (Example: third part). • The Duck example: const duck = { fly: () => console.log("I can fly!"), swim: () => console.log("I can swin!"), feather: true }; const penguin = { swim: () => console.log("I can swin!"), feather: true }; const isDuck = (obj: any) => (obj.hasOwnProperty("feather") && obj.fly && obj.swim); if(isDuck(duck)) { (duck).fly(); } if(!isDuck(penguin)) { console.log("Penguin can't fly...") }
  17. interface Rocket { boosters: number; launch?: () => void; }

    Read-only: interface Rocket { readonly boosters: number; launch?: () => void; } interface Launch { () => void; } Function: Cannot be implemented by a class !
  18. abstract class Rocket { boosters: string; abstract launch(): void; }

    class Soyuz extends Rocket { } class Soyuz extends Rocket { launch(): void { throw new Error("Not implemented."); } }
  19. abstract class Rocket { readonly boosters: number; constructor(boosters: number) {

    this.boosters = boosters; } abstract launch() : void; } class RocketFactory<T extends Rocket> { ctor: new (boosters: number) => T; constructor(ctor: new (boosters: number) => T) { this.ctor = ctor; } create(boosters: number): T { return new this.ctor(boosters); } }
  20. None
  21. Types === static constraints • Type categories: • primitive •

    object • union • intersection • Special type: • any • null • undefined • void • Type alias type Bool = boolean;
  22. The light version ☺ undefined null void number primitive string

    boolean any object array class interface function
  23. Discriminated Union Intersection Union Type Guards Mapped Conditional Infer Immutability

  24. None
  25. None
  26. None
  27. None
  28. None