TypeScript で Enum を使用する方法 (ステップバイステップ)

TypeScript の列挙型は、関連する値のコレクションを表すために使用できる名前付き定数のセットを定義する方法です。これらの値にわかりやすい名前を付けることで、コードの可読性と保守性が向上します。このガイドでは、TypeScript での列挙型の使用について、その種類、利点、および実用的な例を取り上げながら、手順を追って説明します。

Enum とは何ですか?

enum ("enumeration" の略) は、TypeScript の特別なデータ型で、名前付き定数のセットを定義できます。これらの名前付き定数は数値または文字列の値を表すことができるため、コードの説明がわかりやすくなり、エラーが発生しにくくなります。

TypeScript の列挙型の種類

TypeScript には 3 種類の列挙型があります。

数値列挙型
文字列列挙型
異種列挙型

数値列挙型

数値列挙型は TypeScript のデフォルトです。数値列挙型は、0 から始まる数値、または指定されている場合はカスタム開始値から自動的に割り当てられる名前付き値のセットです。

基本的な数値列挙型の例

以下は数値列挙の簡単な例です。

enum Direction {
  Up,
  Down,
  Left,
  Right
}

let move: Direction = Direction.Up;
console.log(move); // Output: 0

この例では、Direction 列挙型には、Up、Down、Left、Right の 4 つのメンバーがあります。デフォルトでは、Up には値 0 が割り当てられ、Down には 1 が割り当てられます。メンバーにカスタム数値を指定することもできます。

カスタム値を持つ数値列挙型

列挙型メンバーにカスタム値を割り当てることができます。

enum Status {
  New = 1,
  InProgress,
  Done = 5,
  Cancelled
}

console.log(Status.New); // Output: 1
console.log(Status.InProgress); // Output: 2
console.log(Status.Done); // Output: 5
console.log(Status.Cancelled); // Output: 6

この例では、New は 1 に設定され、InProgress は自動的に 2 に設定され、Done は 5 に設定され、Cancelled は自動的に 6 に設定されます。

文字列列挙型

文字列列挙型は、各メンバーが文字列リテラルで初期化される別のタイプの列挙型であり、読みやすく、デバッグが容易になります。

基本的な文字列列挙型の例

以下は文字列列挙型の例です。

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT"
}

let move: Direction = Direction.Left;
console.log(move); // Output: "LEFT"

この例では、各列挙型メンバーは文字列値で初期化されます。数値列挙型とは異なり、文字列列挙型には自動的に増分される値はありません。

異種列挙型

異種列挙型は、文字列メンバーと数値メンバーの両方を含む列挙型です。異種列挙型を定義することは可能ですが、コードに混乱やエラーが発生する可能性があるため、通常は推奨されません。

異種列挙型の例

異種列挙型の例を次に示します。

enum MixedEnum {
  Yes = "YES",
  No = 0,
  Maybe = 1
}

console.log(MixedEnum.Yes); // Output: "YES"
console.log(MixedEnum.No); // Output: 0

この例では、MixedEnum には文字列と数値の両方が含まれています。このような列挙型は混乱を招く可能性があるため、慎重に使用してください。

列挙型の使用例

列挙型はさまざまなシナリオで役立ちます。

方向 (上、下、左、右) などの関連する定数のセットを表します。
ステートマシンでの状態の定義 (新規、進行中、完了、キャンセル)。
読みやすさを向上させるために、switch-case ステートメントでそれらを使用します。

Switch-Case の例における Enum

switch-case ステートメントで列挙型を使用すると、コードの読みやすさが向上し、状態の管理が容易になります。

enum Status {
  New,
  InProgress,
  Done,
  Cancelled
}

function getStatusMessage(status: Status): string {
  switch (status) {
    case Status.New:
      return "The task is new.";
    case Status.InProgress:
      return "The task is in progress.";
    case Status.Done:
      return "The task is completed.";
    case Status.Cancelled:
      return "The task is cancelled.";
    default:
      return "Unknown status.";
  }
}

console.log(getStatusMessage(Status.InProgress)); // Output: "The task is in progress."

この例では、列挙型を使用することで、switch-case ステートメントが読みやすくなり、エラーが発生しにくくなります。

結論

TypeScript の列挙型は、一連の名前付き定数を定義する強力な方法を提供し、コードの可読性と型の安全性を向上させます。数値、文字列、または異種の列挙型を使用することで、コードをより適切に管理および整理できます。このステップバイステップガイドに従うことで、TypeScript で列挙型を使用してコードをよりクリーンで保守しやすいものにすることができます。

typescript 列挙型定数数値文字列異種値名前付き switch-case 使用例ガイド初心者コード