TypeScript Enum マージ方法

TypeScript では、直接的に 2 つの Enum をマージする機能はありません。しかし、いくつかの手法を使って、複数の Enum を統合して一つの型として扱うことができます。

文字列型 Enum の利用

文字列型 Enum を使用すると、異なる Enum の値が重複しない限り、それらを簡単に結合することができます。

enum Color {
  Red = 'Red',
  Green = 'Green',
  Blue = 'Blue'
}

enum Size {
  Small = 'Small',
  Medium = 'Medium',
  Large = 'Large'
}

type ColorSize = Color | Size;

// 使用例
const colorSize: ColorSize = Color.Red;
const anotherColorSize: ColorSize = Size.Large;

ユニークな数値の利用

各 Enum の値にユニークな数値を割り当てることで、それらを結合することができます。

enum Color {
  Red = 1,
  Green = 2,
  Blue = 3
}

enum Size {
  Small = 4,
  Medium = 5,
  Large = 6
}

type ColorSize = Color | Size;

// 使用例
const colorSize: ColorSize = Color.Red;
const anotherColorSize: ColorSize = Size.Large;

ネストした Enum の利用

enum Category {
  Color = 1,
  Size = 2
}

enum ColorSize {
  Red = Category.Color * 10 + 1,
  Green = Category.Color * 10 + 2,
  Blue = Category.Color * 10 + 3,
  Small = Category.Size * 10 + 1,
  Medium = Category.Size * 10 + 2,
  Large = Category.Size * 10 + 3
}

// 使用例
const colorSize: ColorSize = ColorSize.Red;
const anotherColorSize: ColorSize = ColorSize.Large;

enum Color {
  Red = 'Red',
  Green = 'Green',
  Blue = 'Blue'
}

enum Size {
  Small = 'Small',
  Medium = 'Medium',
  Large = 'Large'
}

type ColorSize = Color | Size;

// 使用例
const colorSize1: ColorSize = Color.Red;
const colorSize2: ColorSize = Size.Large;

enum Color {
  Red = 1,
  Green = 2,
  Blue = 3
}

enum Size {
  Small = 4,
  Medium = 5,
  Large = 6
}

type ColorSize = Color | Size;

// 使用例
const colorSize1: ColorSize = Color.Red;
const colorSize2: ColorSize = Size.Large;

enum Category {
  Color = 1,
  Size = 2
}

enum ColorSize {
  Red = Category.Color * 10 + 1,
  Green = Category.Color * 10 + 2,
  Blue = Category.Color * 10 + 3,
  Small = Category.Size * 10 + 1,
  Medium = Category.Size * 10 + 2,
  Large = Category.Size * 10 + 3
}

// 使用例
const colorSize1: ColorSize = ColorSize.Red;
const colorSize2: ColorSize = ColorSize.Large;

ユニオン型の利用

enum Color {
  Red,
  Green,
  Blue
}

enum Size {
  Small,
  Medium,
  Large
}

type ColorSize = Color | Size;

// 使用例
const colorSize1: ColorSize = Color.Red;
const colorSize2: ColorSize = Size.Large;

enum Color {
  Red = 'Red',
  Green = 'Green',
  Blue = 'Blue'
}

enum Size {
  Small = 'Small',
  Medium = 'Medium',
  Large = 'Large'
}

type ColorSize = Color | Size;

// 使用例
const colorSize1: ColorSize = Color.Red;
const colorSize2: Size.Large;

インターセクション型の利用

2 つの Enum をインターセクション型に組み合わせることで、両方の Enum の値を持つ新しい型を作成できます。ただし、この方法は、両方の Enum に共通の値がある場合にのみ有効です。

enum ColorSize {
  Red = 1,
  Green = 2,
  Blue = 3,
  Small = 4,
  Medium = 5,
  Large = 6
}

enum ColorSize2 {
  Red = 1,
  Green = 2,
  Blue = 3,
  Small = 4,
  Medium = 5,
  Large = 6
}

type CombinedColorSize = ColorSize & ColorSize2;

// 使用例
const combinedSize: CombinedColorSize = ColorSize.Red;

カスタム型ガードの利用

カスタム型ガード関数を作成して、特定の Enum 値を判定し、適切な処理を行うことができます。

enum Color {
  Red,
  Green,
  Blue
}

enum Size {
  Small,
  Medium,
  Large
}

type ColorSize = Color | Size;

function isColor(value: ColorSize): value is Color {
  return value === Color.Red || value === Color.Green || value === Color.Blue;
}

// 使用例
const colorSize: ColorSize = Color.Red;

if (isColor(colorSize)) {
  console.log('It\'s a color:', colorSize);
} else {
  console.log('It\'s a size:', colorSize);
}