基本文法の基礎8▾
データ構造とオブジェクト指向8▾
構文の基本を深める9▾
関数とデータ構造の応用9▾
アルゴリズムとテストの基礎8▾
文字列・数値操作の応用8▾
実務で役立つ機能8▾
Enum(列挙型)の基本
このレッスンでは、JavaScriptでEnum(列挙型)を再現する方法を学び、決まった選択肢だけを安全に扱えるようになることを目標にします。「JavaScript Enum 書き方」「JavaScript Object.freeze 使い方」で調べている方向けです。
JavaScriptには専用のEnum構文はありませんが、Object.freeze()で書き換え不可能なオブジェクトを作ることで、決まった選択肢だけを表す「列挙型」を再現できます。「信号機は赤・青・黄しかない」ように、値の種類をあらかじめ限定したいときに使います。文字列や数値を直接あちこちに書く(マジックナンバーと呼ばれます)よりも、名前のついた定数を使う方がコードの意図が伝わりやすくなります。
サンプルコードでは、ColorというオブジェクトをObject.freeze()で凍結し、RED・GREEN・BLUEという3つの選択肢だけを持たせています。Color.REDのように値を取り出せるほか、Object.values(Color)ですべての選択肢を配列として取得することもできます。
初心者がよくつまずくのが、Object.freeze()を使わずに普通のオブジェクトとしてEnumを作ってしまい、あとから値を書き換えられてしまう点です。「決まった選択肢」という意図を守るためには、必ず凍結しておく必要があります。タイプミスも防げるため、文字列を直接あちこちに書くよりも安全です。
実際の開発現場では、注文のステータス(処理中・発送済み・完了など)や、ユーザーの権限レベルといった「決まった種類しかない値」を扱う際にこの考え方が使われます。TypeScriptという言語ではEnumが標準の機能として用意されており、より本格的な型安全性を求める場合の選択肢にもなります。
💡 console.log() の内容が実行結果に表示されます。
信号機の色のように、決まった選択肢だけを安全に扱えるようになります。