この章のゴール
型の役割と限界を説明し、具体的な確認事項を開発担当に伝えられる。
この章で学ぶこと
まず、この5つを持ち帰る
- TypeScriptはJavaScript＋型のチェック。データの食い違いに、実行前に気づく助けになる。
- 型は、扱う値と形の約束。string・number・boolean、オブジェクトと配列が基本。
- コードは「入力→条件・処理→結果」で読む。関数の引数と戻り値、ifの境界に注目する。
- 「ない」と「失敗する」場合も仕様に入れる。任意項目、null、通信失敗、見つからないデータを考える。
- 型チェックが通っても、業務の確認は必要。実行時の検査、権限、計算ルールは別に確かめる。
会議の手元に置く、早見表
| 見かけるもの | まずこう読む |
|---|---|
const amount: number = 1200 | 金額は数値。値は1200 |
memo?: string | メモは文字列。項目は省略できる |
Expense[] | 申請データの一覧 |
"下書き" | "申請中" | 決めた選択肢のどちらか |
value === undefined | 値が未設定かを確認 |
function f(x: number): string | 数値を受け取り文字列を返す処理 |
Promise<Expense> | あとで申請データが得られる処理 |
as / any | 検査を弱めていないか、理由を聞く |
ミニケース：申請ボタンを押せません
開発担当から「APIのamountがstringで、画面の型はnumberなのでエラーになっています。as numberで直します」と連絡がありました。どう返しますか？
会話の例と、確認する理由を見る
「金額は計算に使う数値という仕様ですね。APIからは実際に何が届いていますか？ asでは値が変わらないので、送信元か受信時の変換を確認したいです。空欄や数値でない値も、保存前に検査してください。正常値と範囲外の値で動作を確かめましょう。」
エラーを消す手段だけに注目せず、データの流れと業務ルールに戻ることがポイントです。
学び終わったら、次にすること
まずは自分の仕事の入力フォームを1つ選び、項目名・値の種類・必須か任意かを書き出してみましょう。そのあと、未入力・境界値・通信失敗のときに何が起きるべきかを考えます。これだけでも、仕様の会話が具体的になります。
実際にコードを書いてみたい方は、公式のTypeScript Playground ↗で短い例を試せます。会社のソースコードや個人情報は、利用が認められた場所で扱ってください。
最後の確認テスト
各問の答えを選び、「答え合わせ」を押してください。何度でもやり直せます。
全8章、おつかれさまでした。
理解できたところまでを振り返って、読了を記録しましょう。
記録はこのブラウザに保存されます。