Enumでコードをもっと読みやすく！ TypeScriptにおけるEnumの使い方

2024-05-08

TypeScriptにおけるEnumの動作

TypeScriptにおけるEnumは、名前付きの定数の集合を定義するための機能です。それぞれの定数は、列挙子と呼ばれ、固有の値を持ちます。Enumは、コードをより読みやすく、理解しやすく、保守しやすくするために使用されます。

Enumの種類

TypeScriptには、主に2種類のEnumがあります。

数値ベースのEnum: 列挙子の値に数値を割り当てます。これは、整数を表すEnumに適しています。

enum Direction {
  Top = 0,
  Right = 1,
  Bottom = 2,
  Left = 3
}

enum Status {
  "Active" = "active",
  "Pending" = "pending",
  "Inactive" = "inactive"
}

Enumを使用するには、まずEnumを宣言する必要があります。上記の例のように、enumキーワードとEnumの名前を宣言します。その後、列挙子をカンマで区切って宣言します。

Enumの値を使用するには、.演算子を使用してEnum名にアクセスし、列挙子の名前を指定します。

let direction: Direction = Direction.Top;
console.log(direction); // Output: Top

let status: Status = Status.Active;
console.log(status); // Output: active

Enumの利点

Enumを使用する利点は次のとおりです。

コードの可読性と理解しやすさの向上: Enumを使用すると、定数に意味のある名前を付けることができます。これにより、コードが読みやすくなり、理解しやすくなります。
コードの保守性の向上: Enumを使用すると、定数の値を一箇所で変更できます。これにより、コードの保守性が向上します。
エラーの削減: Enumを使用すると、コンパイラが誤った定数値の使用を検出するのに役立ちます。これにより、エラーが削減されます。

Enumは、オブジェクトと同様にプロパティとメソッドを持つことができます。
Enumは、ジェネリック型と同様にジェネリックにすることができます。

TypeScriptにおけるEnumのサンプルコード

以下に、TypeScriptにおけるEnumの使用方法を示すサンプルコードを示します。

例1：数値ベースのEnum

この例では、曜日を表す数値ベースのEnumを定義します。

enum DayOfWeek {
  Sunday = 0,
  Monday = 1,
  Tuesday = 2,
  Wednesday = 3,
  Thursday = 4,
  Friday = 5,
  Saturday = 6
}

let today: DayOfWeek = DayOfWeek.Friday;
console.log(today); // Output: Friday

let weekend: DayOfWeek = DayOfWeek.Saturday;
console.log(weekend); // Output: Saturday

例2：文字列ベースのEnum

enum OrderStatus {
  "Pending" = "pending",
  "Processing" = "processing",
  "Shipped" = "shipped",
  "Delivered" = "delivered",
  "Canceled" = "canceled"
}

let orderStatus: OrderStatus = OrderStatus.Processing;
console.log(orderStatus); // Output: processing

let canceledOrder: OrderStatus = OrderStatus.Canceled;
console.log(canceledOrder); // Output: canceled

例3：Enumの値と名前のアクセス

この例では、Enumの値と名前を取得する方法を示します。

enum Color {
  Red = "#ff0000",
  Green = "#00ff00",
  Blue = "#0000ff"
}

let redColor: Color = Color.Red;
console.log(redColor); // Output: #ff0000

console.log(Color[redColor]); // Output: Red

let greenColorName: string = Color[Color.Green];
console.log(greenColorName); // Output: Green

例4：Enumの拡張

enum Shape {
  Circle,
  Square,
  Rectangle
}

enum Shape {
  getArea(this: Shape): number {
    switch (this) {
      case Shape.Circle:
        return Math.PI * radius * radius;
      case Shape.Square:
        return side * side;
      case Shape.Rectangle:
        return width * height;
      default:
        return 0;
    }
  }
}

let circle: Shape = Shape.Circle;
let radius = 5;
console.log(circle.getArea()); // Output: 78.53975

let square: Shape = Shape.Square;
let side = 10;
console.log(square.getArea()); // Output: 100

let rectangle: Shape = Shape.Rectangle;
let width = 5;
let height = 10;
console.log(rectangle.getArea()); // Output: 50

これらの例は、TypeScriptにおけるEnumの基本的な使用方法を示すものです。Enumは、コードをより読みやすく、理解しやすく、保守しやすくするために、さまざまな方法で使用することができます。

TypeScriptにおけるEnumの代替方法

TypeScriptにおけるEnumは便利な機能ですが、いくつかの代替方法があります。状況によっては、Enumよりもこれらの代替方法の方が適している場合があります。

オブジェクトリテラルを使用して、名前付きの定数の集合を定義できます。これは、Enumと似ていますが、いくつかの重要な違いがあります。

オブジェクトリテラルには、型アノテーションを追加できません。これは、コンパイラが型のエラーを検出できないことを意味します。
オブジェクトリテラルには、列挙子の値を自動的に生成する機能がありません。
オブジェクトリテラルは、ジェネリックにすることができません。

const DayOfWeek = {
  Sunday: 0,
  Monday: 1,
  Tuesday: 2,
  Wednesday: 3,
  Thursday: 4,
  Friday: 5,
  Saturday: 6
};

let today: DayOfWeek = DayOfWeek.Friday;
console.log(today); // Output: Friday

ユニオン型

ユニオン型には、名前付きの定数を定義する機能がありません。
ユニオン型は、ジェネリックにすることができます。

type DayOfWeek = 0 | 1 | 2 | 3 | 4 | 5 | 6;

let today: DayOfWeek = 5;
console.log(today); // Output: 5

定数を使用して、個々の名前付きの定数を定義できます。これは、シンプルなケースに適していますが、多くの定数を定義する場合は煩雑になる可能性があります。

const Sunday = 0;
const Monday = 1;
const Tuesday = 2;
const Wednesday = 3;
const Thursday = 4;
const Friday = 5;
const Saturday = 6;

let today: number = Friday;
console.log(today); // Output: 5