TypeScript：文字列列挙型（String Enum）の作り方

TypeScriptで文字列値を持つ列挙型を作成する方法

定数列挙型を使用する

const enum Color {
  Red = "赤",
  Green = "緑",
  Blue = "青",
}

const color: Color = Color.Red; // "赤"

console.log(color); // "赤"

この方法では、const enum キーワードを使用して定数列挙型を定義します。各メンバーは、文字列リテラル値に割り当てられます。

オブジェクトリテラルを使用する

const Color = {
  Red: "赤",
  Green: "緑",
  Blue: "青",
} as const;

const color: Color = Color.Red; // "赤"

console.log(color); // "赤"

この方法では、オブジェクトリテラルを使用して文字列リテラルの集合を定義します。as const アサーションを使用して、オブジェクトリテラルを定数型として扱います。

どちらの方法も、文字列値を持つ列挙型を作成するために使用できます。どちらを選択するかは、個人的な好みやコードのスタイルガイドによって異なります。

定数列挙型の利点

• コードの簡潔性
• 型安全性

• より柔軟な定義

文字列列挙型の使用例

文字列値を持つ列挙型は、さまざまな場面で使用できます。

• 状態を表す値（例：Status.Pending、Status.Completed）
• ユーザーインターフェースの要素（例：Color.Red、Color.Green）
• 設定値（例：Environment.Production、Environment.Development）

補足

• TypeScript 4.0以降では、enum キーワードを使用して文字列列挙型を直接定義できます。
• 文字列列挙型は、JavaScriptのオブジェクトに変換されます。

const enum Color {
  Red = "赤",
  Green = "緑",
  Blue = "青",
}

function printColor(color: Color) {
  console.log(color);
}

printColor(Color.Red); // "赤"
printColor(Color.Green); // "緑"
printColor(Color.Blue); // "青"

const Color = {
  Red: "赤",
  Green: "緑",
  Blue: "青",
} as const;

function printColor(color: Color) {
  console.log(color);
}

printColor(Color.Red); // "赤"
printColor(Color.Green); // "緑"
printColor(Color.Blue); // "青"

enum Status {
  Pending = "保留中",
  Completed = "完了",
}

const orderStatus: Status = Status.Pending;

if (orderStatus === Status.Completed) {
  // 注文が完了した処理
} else {
  // 注文が保留中の処理
}

これらのサンプルコードは、TypeScriptで文字列値を持つ列挙型を作成する方法と、さまざまな場面でどのように使用できるかを示しています。

文字列値を持つ列挙型を作成する他の方法

union 型を使用する

type Color = "赤" | "緑" | "青";

const color: Color = "赤";

console.log(color); // "赤"

この方法では、union 型を使用して文字列リテラルの集合を定義します。

type Color = `${"赤" | "緑" | "青"}`;

const color: Color = "赤";

console.log(color); // "赤"

enum とオブジェクトリテラルの組み合わせを使用する

enum Color {
  Red,
  Green,
  Blue,
}

const colorMap: { [key in Color]: string } = {
  [Color.Red]: "赤",
  [Color.Green]: "緑",
  [Color.Blue]: "青",
};

const color: string = colorMap[Color.Red];

console.log(color); // "赤"

この方法では、enum とオブジェクトリテラルを組み合わせて文字列値を持つ列挙型を作成します。

• 簡潔さを重視する場合は、定数列挙型を使用するのがおすすめです。
• 既存のコードとの互換性を考慮する場合は、union 型を使用するのがおすすめです。