TypeScript Enum

概要: このチュートリアルでは、TypeScriptのenum型とその効果的な使用方法について学びます。

enumとは

enumは、名前付き定数値のグループです。Enumは列挙型を意味します。

enumを定義するには、以下の手順に従います。

• まず、enumキーワードの後にenumの名前を付けます。
• 次に、enumの定数値を定義します。

enumを定義するための構文を以下に示します。

enum name {constant1, constant2, ...};Code language: TypeScript (typescript)

この構文では、constant1、constant2などは、enumのメンバーとも呼ばれます。

TypeScript enum型の例

次の例では、1年の月を表すenumを作成します。

enum Month {
    Jan,
    Feb,
    Mar,
    Apr,
    May,
    Jun,
    Jul,
    Aug,
    Sep,
    Oct,
    Nov,
    Dec
};Code language: TypeScript (typescript)

この例では、enum名はMonthで、定数値はJan、Feb、Marなどです。

以下は、Month enumをmonthパラメータの型として使用する関数を宣言しています。

function isItSummer(month: Month) {
  let isSummer: boolean;
  switch (month) {
    case Month.Jun:
    case Month.Jul:
    case Month.Aug:
      isSummer = true;
      break;
    default:
      isSummer = false;
      break;
  }
  return isSummer;
}Code language: TypeScript (typescript)

そして、このように呼び出すことができます。

console.log(isItSummer(Month.Jun)); // trueCode language: JavaScript (javascript)

この例では、1、2、3...のようなマジックナンバーではなく、enumで定義されたJan、Feb、Mar...などの定数値を使用しています。これにより、コードがより明確になります。

TypeScript enumの仕組み

コードでは、enumで定義された定数値を使用することをお勧めします。

ただし、次の例では、enumではなく数値をisItSummer()関数に渡しています。そして、それは動作します。

console.log(isItSummer(6)); // trueCode language: JavaScript (javascript)

この例では、Month enumで定義された定数の代わりに数値（6）を使用しています。そして、それは動作します。

Month enumの生成されたJavascriptコードを確認してみましょう。

var Month;
(function (Month) {
    Month[Month["Jan"] = 0] = "Jan";
    Month[Month["Feb"] = 1] = "Feb";
    Month[Month["Mar"] = 2] = "Mar";
    Month[Month["Apr"] = 3] = "Apr";
    Month[Month["May"] = 4] = "May";
    Month[Month["Jun"] = 5] = "Jun";
    Month[Month["Jul"] = 6] = "Jul";
    Month[Month["Aug"] = 7] = "Aug";
    Month[Month["Sep"] = 8] = "Sep";
    Month[Month["Oct"] = 9] = "Oct";
    Month[Month["Nov"] = 10] = "Nov";
    Month[Month["Dec"] = 11] = "Dec";
})(Month || (Month = {}));Code language: TypeScript (typescript)

そして、Month変数をコンソールに出力することができます。

{
  '0': 'Jan', 
  '1': 'Feb', 
  '2': 'Mar', 
  '3': 'Apr', 
  '4': 'May', 
  '5': 'Jun', 
  '6': 'Jul', 
  '7': 'Aug', 
  '8': 'Sep', 
  '9': 'Oct', 
  '10': 'Nov',
  '11': 'Dec',
  Jan: 0,     
  Feb: 1,     
  Mar: 2,     
  Apr: 3,     
  May: 4,
  Jun: 5,
  Jul: 6,
  Aug: 7,
  Sep: 8,
  Oct: 9,
  Nov: 10,
  Dec: 11
}Code language: TypeScript (typescript)

出力は、TypeScriptのenumがJavaScriptのオブジェクトであることを示しています。このオブジェクトには、enumで宣言された名前付きプロパティがあります。たとえば、Janは0、Febは1です。

生成されたオブジェクトには、名前付き定数を表す文字列値を持つ数値キーもあります。

そのため、enumを受け入れる関数に数値を渡すことができます。つまり、enumメンバーは数値であり、定義された定数でもあります。

enumメンバーの番号を指定する

TypeScriptは、enum定義に現れるメンバーの順序に基づいて、enumのメンバーの数値を定義します。たとえば、Janは0、Febは1になります。

このように、enumのメンバーに明示的に番号を指定することができます。

enum Month {
    Jan = 1,
    Feb,
    Mar,
    Apr,
    May,
    Jun,
    Jul,
    Aug,
    Sep,
    Oct,
    Nov,
    Dec
};Code language: TypeScript (typescript)

この例では、Jan定数値は0ではなく1になります。Febは2、Marは3になります。

enumを使用する場合

以下の場合にenumを使用する必要があります。

• 密接に関連する固定値の小さなセットがある場合。
• そして、これらの値はコンパイル時にわかっている場合。

たとえば、承認ステータスにenumを使用できます。

enum ApprovalStatus {
    draft,
    submitted,
    approved,
    rejected
};Code language: TypeScript (typescript)

そして、ApprovalStatus enumをこのように使用できます。

const request =  {
    id: 1,
    status: ApprovalStatus.approved,
    description: 'Please approve this request'
};

if(request.status === ApprovalStatus.approved) {
    // send an email
    console.log('Send email to the Applicant...');
}Code language: TypeScript (typescript)

まとめ

• TypeScriptのenumは、定数値のグループです。
• 内部的には、enumはenum定義で宣言された名前付きプロパティを持つJavaScriptオブジェクトです。
• 密接に関連し、コンパイル時にわかっている固定値の小さなセットがある場合は、enumを使用してください。