👏

【TypeScript基礎②】型推論と型注釈の使い分け

2025/01/29に公開

結論

複雑な型(オブジェクトなど)や曖昧な型(ユニオン型やジェネリクス型など)は型注釈で明示的に型を指定し、型の安全性を保つ方が良いが、明確な型は型推論に任せるのがベストプラクティス

型推論

  • TypeScriptが自動的に変数や関数の方を推測して決定するしくみ
  • 型推論の例は下記
// 文字列型と推論
const name = "John"

型推論を使うとき

  • シンプルな型を扱うときに使う
    • プリミティブ型など

型注釈

  • TypeScriptで変数や関数に明示的に型を指定するしくみ
  • 型注釈の例は下記
// 文字列型を明示
const name: string = "John"

型注釈を使うとき

  • 複雑な型を扱うとき
    • 型注釈を使うことで型安全性が向上

型注釈の使用例

1. オブジェクトのプロパティ

interface User {
  name: string;
  age: number;
}

const user: User = {
  name: "Alice",
  age: 25
};

2. 関数の引数と戻り値

function add(a: number, b: number): number {
  return a + b;
}

3. ユニオン型やジェネリック型の使用時

function identity<T>(arg: T): T {
  return arg;
}
ジェネリック型とは

汎用的な型を定義するための型

function identity<T>(arg: T): T {
  return arg;
}

// 使用例
const num = identity<number>(42); // numはnumber型
const str = identity<string>("Hello"); // strはstring型

上記の例における、<T>がジェネリック型のプレースホルダーであり、
関数を呼び出すときび具体的な型を指定できる。

4. 初期値が設定されていない変数やオプショナルな型

初期値がない、または値がオプショナル(設定されないときもある)なときは型推論が行えないため

let isCompleted: boolean;  // 型注釈で明示的にboolean型を指定

Discussion