TypeScriptの型定義が JavaScriptのバグを駆逐する

Transcript

1. TypeScriptͷܕఆ͕ٛ JavaScriptͷόάΛۦஞ͢Δ ࠜ؛ప໵
2. ࣗݾ঺հ • ࠜ؛ప໵ • ϥϯαʔζגࣜձࣾ • ৽نࣄۀ • ओʹϑϩϯτ·ΘΓ୲౰ • ڵຯؔ৺ • React, Vue.js, TypeScript • αʔόʔϨε
3. ࠓ೔࿩͢͜ͱ • ৽ϓϩμΫτʹTypeScriptΛಋೖͯ͠ΈͯͲ͏͔ͩͬͨ • TypeScript͸ͪΌΜͱܕఆٛ͢Ε͹࠷ߴ • ͋Γ͕ͱ͏TypeScript
4. ϥϯαʔζͷϑϩϯτΤϯυٕज़ͷมભ 2008೥ ~ ݱࡏ 2015೥ ~ ݱࡏ 2018೥ ~ ݱࡏ 2017೥ ~ 2018೥
5. ϥϯαʔζͷϑϩϯτΤϯυٕज़ͷมભ 2008೥ ~ ݱࡏ 2015೥ ~ ݱࡏ 2018೥ ~ ݱࡏ 2016೥ ~ 2018೥
6. TypeScriptΛ࢖ͬͯΘ͔ͬͨ͜ͱ ܕఆٛʹΑͬͯόά͕ܹݮ ͪΌΜͱܕఆٛ͠ͳ͍ͱόάΔ
8. JavaScriptͰΑ͘ى͖Δόά
9. JavaScriptͰΑ͘ى͖Δόά data ʹ͸ number ͷ഑ྻΛೖΕΔ → Ұ࣌తʹundefind͕ೖΔύλʔϯ͕͋ͬͨ → <Graph>͸undefindΛ૝ఆ͓ͯ͠ΒͣΤϥʔ ReactͰ͸΍Γ͕ͪ Τϥʔ
10. JavaScriptͰΑ͘ى͖Δόά data ʹ͸ Object ΛೖΕΔ → Ұ࣌తʹundefind͕ೖΔύλʔϯ͕͋ͬͨ → <Graph>͸undefindΛ૝ఆ͓ͯ͠ΒͣΤϥʔ ReactͰͷΤϥʔ͸΄΅͜ͷύλʔϯͷؾ͕͢Δ Τϥʔ TypeScriptͰ͸ൃੜ͠ͳ͍
11. TypeScriptͰܕఆٛͨ͠৔߹
12. TypeScriptͰܕఆٛͨ͠৔߹ ? → undefinedΛڐ͢
13. TypeScriptͰܕఆٛͨ͠৔߹ propsͷܕ͕ܾ·Δ
14. TypeScriptͰܕఆٛͨ͠৔߹ data͸ number[] ͱఆٛ͞Ε͍ͯͨͱ͢Δ
15. TypeScriptͰܕఆٛͨ͠৔߹ ͜ͷ࣌఺Ͱ͸·ͩΤϥʔ → <Graph>ʹ౉͢ data ͕ undefinedͰ͋ΔՄೳੑ͕͋Δ
16. TypeScriptͰܕఆٛͨ͠৔߹ undefinedͷνΣοΫ Τϥʔ͕ग़ͳ͘ͳΔ
17. TypeScriptͰܕఆٛͨ͠৔߹ undefinedͷνΣοΫ Τϥʔ͕ग़ͳ͘ͳΔ
18. TypeScriptͰܕఆٛͨ͠৔߹ undefinedͷνΣοΫ Τϥʔ͕ग़ͳ͘ͳΔ όάΛະવʹ๷͛ͯ࠷ߴ
19. • ͨͩ͜͠Ε͸ܕఆ͕͖ٛͪΜͱ͞Ε͍ͯΔ৔߹ • ϥΠϒϥϦͰରԠ͍ͯ͠ͳ͍৔߹΋ͨ·ʹ͋Δ
 → any Ͱܕఆٛͯ͠৐Γ੾Δ͔͠ͳ͍
 → ٯʹόάͷԹচʹͳΓ΍͍͢ Graph͕ܕఆٛ͞Ε͍ͯͳ͍ͱΤϥʔ͕ग़ͳ͍
20. Enjoy TypeScript!