TypeScriptの実践的な型
union型・型ガード・型推論を解説

// ① 変数に Union 型を使う
let id: number | string;
id = 1;         // OK
id = "abc-123"; // OK
id = true;       // エラー: boolean は number | string に代入不可


// ② 関数の引数に Union 型を使う
function printId(id: number | string): void {
  console.log(`ID: ${id}`);
}

printId(42);        // → ID: 42
printId("abc");    // → ID: abc

// ③ null / undefined との Union（実務で頻出）
function findUser(id: number): { name: string } | null {
  if (id === 1) return { name: "Alice" };
  return null; // 見つからなかった場合
}

const user = findUser(1);
if (user) {
  console.log(user.name); // → Alice（nullチェック後は安全にアクセスできる）
}

// 文字列 Literal 型
type Direction = "north" | "south" | "east" | "west";

function move(dir: Direction): void {
  console.log(`${dir}に移動`);
}

move("north");   // OK
move("up");      // エラー: "up" は Direction 型に存在しない


// 数値 Literal 型
type DiceValue = 1 | 2 | 3 | 4 | 5 | 6;

function rollDice(): DiceValue {
  return (Math.floor(Math.random() * 6) + 1) as DiceValue;
}

// 実務でよく使うパターン：ステータス管理
type OrderStatus =
  | "pending"
  | "confirmed"
  | "shipping"
  | "delivered"
  | "cancelled";

interface Order {
  id:     number;
  status: OrderStatus;
  total:  number;
}

function getStatusLabel(status: OrderStatus): string {
  const labels: Record<OrderStatus, string> = {
    pending:   "注文受付",
    confirmed: "注文確定",
    shipping:  "配送中",
    delivered: "配送完了",
    cancelled: "キャンセル",
  };
  return labels[status];
}

console.log(getStatusLabel("shipping"));  // → 配送中
console.log(rollDice());                   // → 1〜6 のどれか

const ROLES = ["admin", "editor", "viewer"] as const;
// ROLES の型は readonly ["admin", "editor", "viewer"]

// 配列の要素型を取り出す
type Role = typeof ROLES[number]; // "admin" | "editor" | "viewer"

function assignRole(role: Role): void {
  console.log(`ロール「${role}」を割り当てました`);
}

assignRole("admin");   // OK
assignRole("owner");   // エラー: "owner" は Role に存在しない

// "kind" が判別子（タグ）の役割を担う
type Shape =
  | { kind: "circle";    radius:  number }
  | { kind: "rectangle"; width: number; height: number }
  | { kind: "triangle";  base:  number; height: number };

function calcArea(shape: Shape): number {
  switch (shape.kind) {
    case "circle":
      // shape は { kind: "circle"; radius: number } に絞り込まれる
      return Math.PI * shape.radius ** 2;
    case "rectangle":
      return shape.width * shape.height;
    case "triangle":
      return (shape.base * shape.height) / 2;
    default:
      // ここに到達したら never 型になる → 網羅チェック
      const _exhaustive: never = shape;
      return _exhaustive;
  }
}

console.log(calcArea({ kind: "circle",    radius: 5              }).toFixed(2)); // → 78.54
console.log(calcArea({ kind: "rectangle", width: 4, height: 6     }));           // → 24
console.log(calcArea({ kind: "triangle",  base: 3,  height: 8     }));           // → 12

// ① 変数の推論（型注釈は不要）
const count = 0;         // number と推論
const name  = "Alice";   // string と推論
const flags = [true, false]; // boolean[] と推論

// ② 戻り値の推論
function double(n: number) { // 戻り値は number と推論される
  return n * 2;
}

// ③ 制御フローによる絞り込み（型ガードなしで自動絞り込み）
function processInput(input: string | number | null): string {
  if (input === null) {
    return "入力なし"; // input は null に絞り込まれる
  }
  if (typeof input === "number") {
    return input.toString(); // input は number に絞り込まれる
  }
  return input.toUpperCase(); // input は string に絞り込まれる
}

console.log(processInput(null));   // → 入力なし
console.log(processInput(42));     // → 42
console.log(processInput("hello")); // → HELLO

// ④ ReturnType — 関数の戻り値型を取り出す
type DoubleResult = ReturnType<typeof double>; // number
const result: DoubleResult = double(21);
console.log(result); // → 42