Sharing type definitions between TypeScript And Dart

Transcript

1. 5ZQF4DSJQU%BSUؒͰ

   ܕΛڞ༗͢Δ
   2019/6/18 Fukuoka.ts #01 

   ikasoumen
   

   View Slide

2. w JLBTPVNFO
   w UXJUUFS!@JLBTPVNFO
   w QJYJWJLB@TPVNFO
   w HJUIVCJLBTPVNFO
   w ϐΫγϒ෱ԬΦϑΟε
   w 5ZQF4DSJQU͸"OHVMBS͔Β
   w ࠷ۙ͸3FBDUͰ΋ԿͰ΋54Ͱॻ͘
   w Πϥετ΍ອըΛඳ͘ͷ΋޷͖
   ࣗݾ঺հ
   2
   

   View Slide

3. ຊ୊
   

   View Slide

4. w ೔ؒͷࣾһݚमͰ࢖͏ΞϓϦΛ࡞Δ͜ͱʹͳͬͨ
   w ࣾͷΞυϨεͰ֤ࣾһ͕(PPHMFϩάΠϯͰ͖ͯ
   w ࣸਅ͕౤ߘͰ͖ͯ
   w ʮ͍͍ͶʂʯͰ͖Δ
   w ࡞ͬͨํ͕໘ന͍ͷͰ࡞Δ
   w ࢼͯ͠Έ͍ٕͨज़੝Γ͜΋͏ͥʔʂ
   w 'MVUUFS$MPVE'JSFTUPSF
   γφϦΦ
   4
   

   View Slide

5. w (PPHMFͷ/P42-%#
   w (00%
   w ΦϑϥΠϯ࣌Ͱ΋SFBEXSJUFͰ͖Δ
   w ߋ৽͞ΕͨσʔλΛͪ͜Β͔ΒऔΓʹߦ͘ඞཁ͕ͳ͍
   w هड़͢΂͖࣮૷͕͍ͩͿݮΔ
   w #"%
   w %#ʹεΩʔϚ͕ͳ͍
   w σʔλͷݕࡧ΍ෳ਺υΩϡϝϯτͷҰׅஔ׵ʹऑ͍
   'JSFTUPSF
   5
   

   View Slide

6. ͏·͍ो͚ͩٵ͍͍ͨ
   

   View Slide

7. ϦΞϧλΠϜߋ৽͚ͩ
   ඒຯ͍͖͍ͨͩͨ͘͠
   

   View Slide

8. εΩʔϚΛ༻ҙ͠·͠ΐ͏
   

   View Slide

9. View Slide

10. w +40/ͷܕΛجʹଞݴޠͷܕͱͯ͠ग़ྗ
    w TPVSDF+40/ +40/4DIFNB 5ZQF4DSJQU
    w UBSHFU͍Ζ͍Ζ
    RVJDLUZQF
    10
    

    View Slide

11. npx quicktype ./ts/models.ts -o ./dart/models.dart
    DPNNBOE
    

    View Slide

12. export type UserDoc = {
    name: string,
    role: Roles,
    /**
    * @TJS-type integer
    */
    createdAt: number,
    }
    export enum Roles {
    guest = "guest",
    member = "member",
    admin = "admin",
    }
    JOQVU5ZQF4DSJQU
    

    View Slide

13. class UserDoc {
    int createdAt;
    String name;
    Roles role;
    UserDoc({
    this.createdAt,
    this.name,
    this.role,
    });
    factory UserDoc.fromJson(Map json) => new UserDoc(
    createdAt: json["createdAt"],
    name: json["name"],
    role: rolesValues.map[json["role"]],
    );
    Map toJson() => {
    "createdAt": createdAt,
    "name": name,
    "role": rolesValues.reverse[role],
    };
    }
    PVUQVU%BSU
    
    

    View Slide

14. enum Roles { ADMIN, GUEST, MEMBER }
    final rolesValues = new EnumValues({
    "admin": Roles.ADMIN,
    "guest": Roles.GUEST,
    "member": Roles.MEMBER
    });
    class EnumValues {
    Map map;
    Map reverseMap;
    EnumValues(this.map);
    Map get reverse {
    if (reverseMap == null) {
    reverseMap = map.map((k, v) => new MapEntry(v, k));
    }
    return reverseMap;
    }
    }
    PVUQVU%BSU
    
    

    View Slide

15. w 'JSFTUPSF͸+40/֦ுͳσʔλΛอ࣋Ͱ͖Δ
    w 5ZQF4DSJQUΛTPVSDFʹͰ͖Δ
    w +40/4DIFNB͸هड़ྔ͕ଟ͍ˍ׳Ε͍ͯͳ͍
    w ։ൃɾຊ൪σʔλͷ౤ೖεΫϦϓτΛ5ZQF4DSJQUͰॻ͖
    ͍ͨ
    w ಉ͡ܕσʔλ͔Βੜ·Ε࣮ͨ૷ͳͷͰɺ%#ʹ౤ೖͨ͠
    σʔλͱΫϥΠΞϯτͷ࣮૷ͷࠩҟ͕ͳ͘ͳΔ
    બఆཧ༝
    15
    

    View Slide

16. w %#ͷσʔλͷܕ͕߹ͬͯͳ͍Τϥʔͷ๾໓
    w ෆ׳Εͳٕज़ελοΫͰʮΤϥʔͷՄೳੑ͕͋ΔՕॴʯΛ
    ݮΒͤͨͷ͸େ͖͍
    w ෆਖ਼ͳσʔλͷ͍ͤͰϋϚΔͱർฐ͢Δ
    w ࠓ͍ΔϒϥϯνͷεΩʔϚΛҰൃͰ֬ೝͰ͖Δ
    w ͓͔͛ͰΞϓϦ͸ແࣄϦϦʔε͞Εݚम͸੝Γ্͕Γ·͠
    ͨͱ͞
    ಋೖ੒Ռ
    16
    

    View Slide

17. w 'JSFTUPSFʹεΩʔϚΛ༻ҙ͢Δ͜ͱʹΑͬͯ

    νʔϜʹͱͬͯ։ൃΛਐΊ΍͍͢ঢ়ଶʹͨ͠
    w 5ZQF4DSJQU͸ϓϩδΣΫτʹ૊ΈࠐΈ΍͍͢
    w ๛෋ͳOQNύοέʔδࢿݯ
    w σʔλ౤ೖͱ͔ूܭͱ͔
    w ผݴޠͷܕͷࣗಈੜ੒·ͰͰ͖ͪΌ͏
    ·ͱΊ
    17
    

    View Slide