TypeScriptのextends

Transcript

1. !.JTBLJ4PFEB 5ZQF4DSJQUͷFYUFOET 
   .JUBUT
   
2. .JTBLJ4PFEB ൃදऀ גࣜձࣾ#PPL-JWF
   ٕज़։ൃຊ෦γεςϜ։ൃ෦ετΞ։ൃνʔϜ
   ϑϩϯτΤϯυΤϯδχΞ
   5ZQF4DSJQUͰ͸झຯͰόοΫΤϯυ΋ॻ͍ͨΓ͍ͯ͠Δ
   5ZQF4DSJQU͕޷͖ʂ
   ೥౓ͷ54,BJHJ͔ΒελοϑΛ͍ͯ͠Δ
3. ͳͥ͜ͷςʔϚʹͨ͠ͷ͔
4. ʮܕ҆શͬͯɺͲ͏ਂ۷Γ͢ΔΜͩΖ͏ʁʯ w UZQFDIBMMFOHFTʹ௅ઓΛ࢝ΊΔʂ
   w UZQFDIBMMFOHFTΛ௨ͯ͠ؾ͍ͮͨͷ͕ɺܕϨϕϧͰͷߜΓࠐΈ΍ૢ࡞͕ܕ҆ શੑΛܶతʹߴΊͯ͘ΕΔͱ͍͏͜ͱɻ
   w ಛʹFYUFOETΛ࢖ͬͨܕૢ࡞͕ҹ৅తͰͨ͠ɻ
5. FYUFOETͷجຊ
6. FYUFOETͷجຊ w ܕҾ਺
   w Ϋϥεͷܧঝ
7. FYUFOETͷجຊ w ܕҾ਺ɹˡͪ͜Βͷ͓࿩
   w Ϋϥεͷܧঝ
8. FYUFOETͷجຊ T extends U ? X : Y w FYUFOET͸ʮܕ͕৚݅Λຬ͍ͨͯ͠Δ͔ʁʯΛ൑அ͢Δ৚݅ܕͷΩʔߏจɻ
   w ଞͷ
   UZQFPG
   ΍
   JO
   ͕࣮ߦ࣌ͷ஋ʹج͍ͮͯܕΛߜΓࠐΉͷʹର͠ɺ 
 FYUFOET
   Λ࢖ͬͨ৚݅ܕ͸ 
 ʮܕͦͷ΋ͷ͚ͩΛݟͯॲཧΛ෼͚Δʯ७ਮͳܕϨϕϧͷ෼ذͰ͢ɻ
9. ྫ
   
   6OJPOܕͷϑΟϧλϦϯά ໨త
   6OJPO͔Βಛఆͷܕ͚ͩநग़ type OnlyStrings<T> = T extends string ? T : never; type Mixed = "hello" | 42 | "world"; type JustStrings = OnlyStrings<Mixed>; // "hello" | "world" 6OJPOܕʹରͯ͠
   5
   FYUFOET
   ʜ
   ͱॻ͘ͱɺ֤ߏ੒ཁૉʹରͯ͠ݸผʹධՁ͞ ΕΔl෼഑zͱ͍͏࢓༷͕͋Γ·͢ɻ
10. ྫ
    
    ΦϒδΣΫτͷܕΛಛఆ͢Δ ໨త
    ಛఆͷϓϩύςΟΛ࣋ͭܕ͚ͩΛநग़ type Event = | { type: "click"; x: number } | { type: "scroll"; y: number }; type ExtractByType<T, K extends string> = T extends { type: K } ? T : never; type ClickEvent = ExtractByType<Event, "click">; // => { type: "click"; x: number }
11. ྫ
    
    FYUFOETͷ࢖͍ํʢ੍໿
    ˍ
    ৚݅ܕʣ // ੍໿ͱͯ͠ͷextends function logLength<T extends { length: number }>(value: T) { console.log(value.length); } // ৚݅ܕͱͯ͠ͷextends type OnlyStrings<T> = T extends string ? T : never;
12. ৚݅ܕͰͷFYUFOETͷϝϦοτ w ܕͷ҆શੑ͕޲্ʢ༧ظ͠ͳ͍ܕΛ஄͚Δʣ
    w ॊೈͳܕૢ࡞͕Ͱ͖ΔʢܕϨϕϧͰ fi MUFSNBQ͕Մೳʣ
    w ܕਪ࿦͕ਖ਼֬ʹͳΔʢิ׬͕ޮ͖΍͘͢ͳΔʣ
13. ·ͱΊ
14. ·ͱΊ w ܕϨϕϧͷૢ࡞͸ܕ҆શੑͷ伴ʂ
    w ৚݅ܕʹΑΔFYUFOET͸ɺܕͷ෼ذɾબ୒ʹ௒ڧྗɻ
    w UZQFDIBMMFOHFTͰɺܕͷײ֮Λ஁͑Δͷ͓͢͢Ίʂ