TypeScriptとは？
TypeScriptは、JavaScriptに型システムを追加したプログラミング言語です。型があることで、コードを書いている段階でエラーを見つけやすくなります。
なぜ型が必要なのか？
JavaScriptでは、こんなコードを書いてもエラーになりません：
let age = 25; age = "二十五歳"; // 数値から文字列に変わってもOK
でも、実際のアプリケーションでは、「年齢は数値であるべき」というルールがあるはずです。TypeScriptを使うと、このルールをコードで表現できます。
基本的な型
1. string（文字列型）
文字列を扱う型です。
const name: string = "太郎"; const message: string = 'こんにちは'; const template: string = `私の名前は${name}です`;
ポイント：
- シングルクォート
'、ダブルクォート"、バッククォート ``` すべて使えます - バッククォートを使うとテンプレート文字列が書けます
2. number（数値型）
数値を扱う型です。整数も小数も同じnumber型です。
const age: number = 25; const price: number = 1999.99; const temperature: number = -5;
3. boolean（真偽値型）
true または false の2つの値だけを持つ型です。
const isStudent: boolean = true; const hasLicense: boolean = false;
配列の型
同じ型の値を複数持つ場合、配列を使います。
書き方1: 型名[]
const numbers: number[] = [1, 2, 3, 4, 5]; const names: string[] = ["太郎", "花子", "次郎"]; const flags: boolean[] = [true, false, true];
書き方2: Array<型名>
const numbers: Array<number> = [1, 2, 3, 4, 5]; const names: Array<string> = ["太郎", "花子", "次郎"];
どちらを使っても同じですが、型名[] の方がよく使われます。
オブジェクトの型
複数の情報をまとめて扱う場合、オブジェクトを使います。
基本的な書き方
const person: { name: string; age: number } = { name: "太郎", age: 25 };
より複雑な例
const user: { id: number; name: string; email: string; isActive: boolean; } = { id: 1, name: "太郎", email: "[email protected]", isActive: true };
型推論
TypeScriptは賢いので、型を書かなくても自動で推論してくれます。
// 型を明示的に書く const age: number = 25; // 型推論に任せる（TypeScriptが自動でnumber型と判断） const age = 25;
いつ型を書くべき？
- 変数の宣言時に値を代入する場合：型推論に任せてOK
- 変数の宣言時に値を代入しない場合：型を書く
- 関数の引数や戻り値：型を書く（推奨）
実践のヒント
❌ 避けるべきパターン
let data: any = "何でも入る"; // any型は型チェックを無効化してしまう data = 123; data = true; // これでもエラーにならない
✅ 推奨パターン
let message: string = "こんにちは"; // message = 123; // エラー！stringにnumberは代入できない
型をしっかり指定することで、バグを未然に防げます。
まとめ
- string: 文字列を扱う
- number: 数値を扱う
- boolean: true/falseを扱う
- 配列: 同じ型の値を複数持つ（
型名[]） - オブジェクト: 複数のプロパティをまとめる（
{ プロパティ名: 型 }） - 型推論: TypeScriptが自動で型を判断してくれる
次は、より複雑な型定義ができる「インターフェース」と「ジェネリクス」を学びましょう！