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

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

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Tetsuya Negishi Tetsuya Negishi
February 22, 2019
Programming
3
960

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

Avatar for Tetsuya Negishi

Tetsuya Negishi

February 22, 2019
Tweet

More Decks by Tetsuya Negishi

See All by Tetsuya Negishi
SOLIDから考える良いコンポーネントの設計原則
Avatar for Tetsuya Negishi tetsuyanegishi
1
1.6k
React Hooksで美しいコードを書く / Writing beautiful code using React Hooks
Avatar for Tetsuya Negishi tetsuyanegishi
0
200
React初学者が知らない
 コンポーネント分割テクニック
Avatar for Tetsuya Negishi tetsuyanegishi
1
500
AWS Amplifyで作るサーバーレスバックエンド
Avatar for Tetsuya Negishi tetsuyanegishi
3
2k
リアルタイムデータベース
Cloud Firestore入門
Avatar for Tetsuya Negishi tetsuyanegishi
10
8.9k
ブロックチェーンのマイニングとはなにか
Avatar for Tetsuya Negishi tetsuyanegishi
1
100
スクラム開発の手法と実例
Avatar for Tetsuya Negishi tetsuyanegishi
0
250

Other Decks in Programming

See All in Programming
Premier Disciplin for Micro Frontends Multi Version/ Framework Scenarios @OOP 2026, Munic
Avatar for Manfred Steyer manfredsteyer
PRO
0
210
new(1.26) ← これすき / kamakura.go #8
Avatar for utagawa kiki utgwkk
0
1.6k
Rで始めるML・LLM活用入門
Avatar for wakama1994 wakamatsu_takumu
0
160
米国のサイバーセキュリティタイムラインと見る Goの暗号パッケージの進化
Avatar for tom twinkle tomtwinkle
2
420
オブザーバビリティ駆動開発って実際どうなの？
Avatar for yohfee yohfee
3
690
エラーログのマスキングの仕組みづくりに役立ったASTの話
Avatar for Kenichi Shihota kumoichi
0
110
The Ralph Wiggum Loop: First Principles of Autonomous Development
Avatar for Ryuichiro Semba sembayui
0
3.7k
エージェント開発初心者の僕が エージェントを作った話と今後やりたいこと
Avatar for ta-hasunuma thasu0123
0
230
CSC307 Lecture 11
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
590
AIとペアプロして処理時間を97%削減した話 #pyconshizu
Avatar for Kashun Yoshida kashewnuts
1
200
NOT A HOTEL - 建築や人と融合し、自由を創り出すソフトウェア
Avatar for Hokuto Shimokawa not_a_hokuts
2
560
Railsの気持ちを考えながらコントローラとビューを整頓する/tidying-rails-controllers-and-views-as-rails-think
Avatar for MOROHASHI Kyosuke moro
4
370

Featured

See All Featured
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
470
How to make the Groovebox
Avatar for あそなす asonas
2
2k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
880
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
13
1.1k
Navigating Team Friction
Avatar for Lara Hogan lara
192
16k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
21k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
2.7k
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
220
B2B Lead Gen: Tactics, Traps & Triumph
Avatar for Sophie Logan marketingsoph
0
67
A Soul's Torment
Avatar for Nat Ma seathinner
5
2.4k
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.2k

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Λ࢖ͬͯΘ͔ͬͨ͜ͱ ܕఆٛʹΑͬͯόά͕ܹݮ ͪΌΜͱܕఆٛ͠ͳ͍ͱόάΔ

  7. None

  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!