2 つの enum を 1 つにまとめる！TypeScript で enum をマージする方法を徹底解説
TypeScript で 2 つの enum をマージする方法
新しい enum を作成する
最も簡単な方法は、新しい enum を作成し、マージしたい 2 つの enum の値をすべて含めることです。
enum Color {
Red = 0,
Green = 1,
Blue = 2,
}
enum Size {
Small = 0,
Medium = 1,
Large = 2,
}
enum ColorAndSize {
RedSmall = 0,
RedMedium = 1,
RedLarge = 2,
GreenSmall = 3,
GreenMedium = 4,
GreenLarge = 5,
BlueSmall = 6,
BlueMedium = 7,
BlueLarge = 8,
}
この方法の利点は、シンプルで分かりやすいことです。欠点は、すべての値を手で書き写さなければならないことです。
型エイリアスを使用して、2 つの enum を 1 つの型として定義することができます。
type ColorAndSize = Color | Size;
const redSmall: ColorAndSize = Color.Red; // 正しい
const greenLarge: ColorAndSize = Size.Large; // 正しい
const blueMedium: ColorAndSize = 10; // エラー
この方法の利点は、コードを簡潔に記述できることです。欠点は、コンパイラが型エラーを検出しにくいことです。
type ColorAndSize = Color | Size;
const redSmall: ColorAndSize = Color.Red; // 正しい
const greenLarge: ColorAndSize = Size.Large; // 正しい
const blueMedium: ColorAndSize = 10; // 正しい
この方法は、型エイリアスと似ていますが、コンパイラが型エラーを検出しやすいという利点があります。
ライブラリを使用する
いくつかのライブラリは、2 つの enum をマージする機能を提供しています。
これらのライブラリを使用すると、コードをより簡潔に記述することができます。
どの方法を使用するかは、状況によって異なります。シンプルな場合は、新しい enum を作成するのが良いでしょう。コードを簡潔に記述したい場合は、型エイリアスまたはユニオン型を使用することができます。コンパイラが型エラーを検出しやすいようにしたい場合は、ユニオン型を使用するのが良いでしょう。ライブラリを使用すると、コードをより簡潔に記述することができますが、プロジェクトに新しいライブラリを追加する必要があります。
- enum の値に文字列を含めることもできます。
- enum は、定数をグループ化して管理するのに役立ちます。
- TypeScript は、静的に型付けされた言語であるため、コンパイラが型エラーを検出することができます。
TypeScript で 2 つの enum をマージする：サンプルコード
新しい enum を作成する
enum Color {
Red = 0,
Green = 1,
Blue = 2,
}
enum Size {
Small = 0,
Medium = 1,
Large = 2,
}
enum ColorAndSize {
RedSmall = 0,
RedMedium = 1,
RedLarge = 2,
GreenSmall = 3,
GreenMedium = 4,
GreenLarge = 5,
BlueSmall = 6,
BlueMedium = 7,
BlueLarge = 8,
}
function getColorAndSizeName(colorAndSize: ColorAndSize): string {
switch (colorAndSize) {
case ColorAndSize.RedSmall:
return "赤小";
case ColorAndSize.RedMedium:
return "赤中";
case ColorAndSize.RedLarge:
return "赤大";
// 以下省略
}
}
const redSmall = ColorAndSize.RedSmall;
const greenLarge = ColorAndSize.GreenLarge;
console.log(getColorAndSizeName(redSmall)); // 出力： 赤小
console.log(getColorAndSizeName(greenLarge)); // 出力： 緑大
この例では、Color と Size という 2 つの enum を作成し、それらをマージした ColorAndSize という新しい enum を作成しています。getColorAndSizeName 関数は、ColorAndSize 型の値を受け取り、その値に対応する文字列を返します。
型エイリアスを使用する
enum Color {
Red = 0,
Green = 1,
Blue = 2,
}
enum Size {
Small = 0,
Medium = 1,
Large = 2,
}
type ColorAndSize = Color | Size;
function getColorAndSizeName(colorAndSize: ColorAndSize): string {
switch (colorAndSize) {
case Color.Red:
return "赤";
case Color.Green:
return "緑";
case Color.Blue:
return "青";
case Size.Small:
return "小";
case Size.Medium:
return "中";
case Size.Large:
return "大";
}
}
const redSmall: ColorAndSize = Color.Red; // 正しい
const greenLarge: ColorAndSize = Size.Large; // 正しい
const blueMedium: ColorAndSize = 10; // エラー
console.log(getColorAndSizeName(redSmall)); // 出力： 赤
console.log(getColorAndSizeName(greenLarge)); // 出力： 大
// console.log(getColorAndSizeName(blueMedium)); // エラー： 型 '10' は 'ColorAndSize' 型に割り当てることができません
この例では、ColorAndSize という型エイリアスを使用して、Color と Size の値を両方とも表すことができる型を定義しています。getColorAndSizeName 関数は、ColorAndSize 型の値を受け取り、その値に対応する文字列を返します。ただし、コンパイラは型エラーを検出することができないため、誤った値を割り当てると実行時にエラーが発生する可能性があります。
ユニオン型を使用する
enum Color {
Red = 0,
Green = 1,
Blue = 2,
}
enum Size {
Small = 0,
Medium = 1,
Large = 2,
}
type ColorAndSize = Color | Size;
function getColorAndSizeName(colorAndSize: ColorAndSize): string {
switch (colorAndSize) {
case Color.Red:
return "赤";
case Color.Green:
return "緑";
case Color.Blue:
return "青";
case Size.Small:
return "小";
case Size.Medium:
return "中";
case Size.Large:
return "大";
}
}
const redSmall: ColorAndSize = Color.Red; // 正しい
const greenLarge: ColorAndSize =
TypeScript で enum をマージする：その他の方法
type Merge<T, U> = {
[P in keyof T | keyof U]: (P extends keyof T ? T[P] : U[P]) & (P extends keyof U ? U[P] : T[P]);
};
enum Color {
Red = 0,
Green = 1,
Blue = 2,
}
enum Size {
Small = 0,
Medium = 1,
Large = 2,
}
type ColorAndSize = Merge<Color, Size>;
function getColorAndSizeName(colorAndSize: ColorAndSize): string {
switch (colorAndSize) {
case ColorAndSize.RedSmall:
return "赤小";
case ColorAndSize.RedMedium:
return "赤中";
case ColorAndSize.RedLarge:
return "赤大";
// 以下省略
}
}
const redSmall: ColorAndSize = ColorAndSize.RedSmall;
const greenLarge: ColorAndSize = ColorAndSize.GreenLarge;
console.log(getColorAndSizeName(redSmall)); // 出力： 赤小
console.log(getColorAndSizeName(greenLarge)); // 出力： 緑大
この例では、Merge というジェネリック型を使用して、2 つの型のすべてのプロパティをマージできる型を定義しています。ColorAndSize 型は、Color 型と Size 型の両方のプロパティを持つ型になります。
enum Color {
Red = "Red",
Green = "Green",
Blue = "Blue",
}
enum Size {
Small = "Small",
Medium = "Medium",
Large = "Large",
}
const ColorAndSize: { [key: string]: string } = {
...Color,
...Size,
};
function getColorAndSizeName(colorAndSize: string): string {
if (ColorAndSize[colorAndSize] !== undefined) {
return ColorAndSize[colorAndSize];
} else {
return "不明";
}
}
const redSmall = "RedSmall";
const greenLarge = "GreenLarge";
console.log(getColorAndSizeName(redSmall)); // 出力： Red
console.log(getColorAndSizeName(greenLarge)); // 出力： 緑大
console.log(getColorAndSizeName("BlueExtraLarge")); // 出力： 不明
この例では、ColorAndSize というオブジェクトを定義し、Color と Size のすべての値をプロパティとして追加しています。getColorAndSizeName 関数は、文字列を受け取り、その文字列が ColorAndSize オブジェクトにあるかどうかを確認します。存在する場合は、その文字列の値を返します。存在しない場合は、「不明」を返します。
注意事項
- enum の値に文字列を含める場合は、上記の方法でマージする前に、値が重複していないことを確認する必要があります。
typescript types enums
