Apa sintaks yang disukai untuk mendefinisikan enum dalam JavaScript? Sesuatu seperti:

my.namespace.ColorEnum = {
    RED : 0,
    GREEN : 1,
    BLUE : 2
}

// later on

if(currentColor == my.namespace.ColorEnum.RED) {
   // whatever
}

Atau adakah idiom yang lebih disukai?

Karena 1.8.5 dimungkinkan untuk menyegel dan membekukan objek, jadi tentukan yang di atas sebagai:

const DaysEnum = Object.freeze({"monday":1, "tuesday":2, "wednesday":3, ...})

atau

const DaysEnum = {"monday":1, "tuesday":2, "wednesday":3, ...}
Object.freeze(DaysEnum)

dan voila! JS enum.

Namun, ini tidak mencegah Anda menetapkan nilai yang tidak diinginkan ke variabel, yang sering kali merupakan tujuan utama enum:

let day = DaysEnum.tuesday
day = 298832342 // goes through without any errors

Salah satu cara untuk memastikan tingkat keamanan jenis yang lebih kuat (dengan enum atau sebaliknya) adalah dengan menggunakan alat seperti TypeScript atau Flow .

Sumber

Harga tidak diperlukan tetapi saya menyimpannya untuk konsistensi.

Ini bukan jawaban yang bagus, tetapi saya akan mengatakan itu bekerja dengan baik, secara pribadi

Karena itu, karena tidak masalah apa nilainya (Anda telah menggunakan 0, 1, 2), saya akan menggunakan string yang bermakna jika Anda pernah ingin menampilkan nilai saat ini.

MEMPERBARUI

Terima kasih untuk semua upvotes semua orang, tetapi saya tidak berpikir jawaban saya di bawah ini adalah cara terbaik untuk menulis enum di JavaScript lagi. Lihat posting blog saya untuk lebih jelasnya: Enums in JavaScript .

Mengingatkan nama sudah mungkin:

if (currentColor == my.namespace.ColorEnum.RED) {
   // alert name of currentColor (RED: 0)
   var col = my.namespace.ColorEnum;
   for (var name in col) {
     if (col[name] == col.RED)
       alert(name);
   }
}

Atau, Anda bisa membuat objek nilai, sehingga Anda dapat memiliki kue dan memakannya juga:

var SIZE = {
  SMALL : {value: 0, name: "Small", code: "S"}, 
  MEDIUM: {value: 1, name: "Medium", code: "M"}, 
  LARGE : {value: 2, name: "Large", code: "L"}
};

var currentSize = SIZE.MEDIUM;
if (currentSize == SIZE.MEDIUM) {
  // this alerts: "1: Medium"
  alert(currentSize.value + ": " + currentSize.name);
}

Dalam JavaScript, karena ini adalah bahasa yang dinamis, bahkan dimungkinkan untuk menambahkan nilai enum ke set nanti:

// Add EXTRALARGE size
SIZE.EXTRALARGE = {value: 3, name: "Extra Large", code: "XL"};

Ingat, bidang enum (nilai, nama dan kode dalam contoh ini) tidak diperlukan untuk pemeriksaan identitas dan hanya ada untuk kenyamanan. Juga nama properti ukuran itu sendiri tidak perlu kode keras, tetapi juga dapat diatur secara dinamis. Jadi seandainya Anda hanya tahu nama untuk nilai enum baru Anda, Anda masih dapat menambahkannya tanpa masalah:

// Add 'Extra Large' size, only knowing it's name
var name = "Extra Large";
SIZE[name] = {value: -1, name: name, code: "?"};

Tentu saja ini berarti bahwa beberapa asumsi tidak lagi dapat dibuat (nilai tersebut mewakili urutan yang benar untuk ukuran misalnya).

Ingat, dalam JavaScript suatu objek sama seperti peta atau tabel hash . Satu set pasangan nama-nilai. Anda dapat mengulanginya atau memanipulasi mereka tanpa tahu banyak tentang mereka sebelumnya.

Contoh

for (var sz in SIZE) {
  // sz will be the names of the objects in SIZE, so
  // 'SMALL', 'MEDIUM', 'LARGE', 'EXTRALARGE'
  var size = SIZE[sz]; // Get the object mapped to the name in sz
  for (var prop in size) {
    // Get all the properties of the size object, iterates over
    // 'value', 'name' and 'code'. You can inspect everything this way.        
  }
} 

Omong-omong, jika Anda tertarik dengan namespace, Anda mungkin ingin melihat solusi saya untuk namespace sederhana dan kuat dan manajemen dependensi untuk JavaScript: Paket JS

Intinya: Anda tidak bisa.

Anda bisa memalsukannya, tetapi Anda tidak akan mendapatkan keamanan tipe. Biasanya ini dilakukan dengan membuat kamus sederhana dari nilai string yang dipetakan ke nilai integer. Sebagai contoh:

var DaysEnum = {"monday":1, "tuesday":2, "wednesday":3, ...}

Document.Write("Enumerant: " + DaysEnum.tuesday);

Masalah dengan pendekatan ini? Anda dapat secara tidak sengaja mendefinisikan ulang enumerant Anda, atau secara tidak sengaja memiliki nilai enumeran duplikat. Sebagai contoh:

DaysEnum.monday = 4; // whoops, monday is now thursday, too

Edit

Bagaimana dengan Object.freeze Artur Czajka? Bukankah itu berhasil untuk mencegah Anda menetapkan hari Senin hingga Kamis? - Fry Quad

Tentu saja, Object.freezeakan benar-benar memperbaiki masalah yang saya keluhkan. Saya ingin mengingatkan semua orang bahwa ketika saya menulis di atas,Object.freeze tidak benar-benar ada.

Sekarang .... sekarang membuka beberapa sangat kemungkinan yang menarik.

Edit 2
Inilah perpustakaan yang sangat bagus untuk membuat enum.

http://www.2ality.com/2011/10/enums.html

Meskipun mungkin tidak cocok dengan setiap penggunaan enum yang valid, ia berjalan sangat jauh.

Inilah yang kita semua inginkan:

function Enum(constantsList) {
    for (var i in constantsList) {
        this[constantsList[i]] = i;
    }
}

Sekarang Anda dapat membuat enum:

var YesNo = new Enum(['NO', 'YES']);
var Color = new Enum(['RED', 'GREEN', 'BLUE']);

Dengan melakukan ini, konstanta dapat diakses dengan cara biasa (YesNo.YES, Color.GREEN) dan mereka mendapatkan nilai int sekuensial (TIDAK = 0, YA = 1; MERAH = 0, HIJAU = 1, BIRU = 2).

Anda juga dapat menambahkan metode, dengan menggunakan Enum.prototype:

Enum.prototype.values = function() {
    return this.allValues;
    /* for the above to work, you'd need to do
            this.allValues = constantsList at the constructor */
};

Sunting - peningkatan kecil - sekarang dengan varargs: (sayangnya itu tidak berfungsi dengan baik pada IE: S ... harus tetap dengan versi sebelumnya)

function Enum() {
    for (var i in arguments) {
        this[arguments[i]] = i;
    }
}

var YesNo = new Enum('NO', 'YES');
var Color = new Enum('RED', 'GREEN', 'BLUE');

Di sebagian besar browser modern, ada simbol tipe data primitif yang dapat digunakan untuk membuat enumerasi. Ini akan memastikan keamanan jenis enum karena setiap nilai simbol dijamin oleh JavaScript menjadi unik, yaitu Symbol() != Symbol(). Sebagai contoh:

const COLOR = Object.freeze({RED: Symbol(), BLUE: Symbol()});

Untuk menyederhanakan debugging, Anda bisa menambahkan deskripsi ke nilai enum:

const COLOR = Object.freeze({RED: Symbol("RED"), BLUE: Symbol("BLUE")});

Demo plunker

Pada GitHub Anda dapat menemukan pembungkus yang menyederhanakan kode yang diperlukan untuk menginisialisasi enum:

const color = new Enum("RED", "BLUE")

color.RED.toString() // Symbol(RED)
color.getName(color.RED) // RED
color.size // 2
color.values() // Symbol(RED), Symbol(BLUE)
color.toString() // RED,BLUE

𝗣𝗹𝗮𝗶𝗻 𝗩𝗮𝗻𝗶𝗹𝗹𝗮𝗝𝗦 𝗩𝗮𝗿𝗶𝗮𝗯𝗹𝗲 𝗡𝗮𝗺𝗲𝘀

Mari kita langsung ke masalah: ukuran file. Setiap jawaban lain yang tercantum di sini membesar-besarkan kode Anda. Saya sampaikan kepada Anda bahwa untuk kinerja terbaik, keterbacaan kode, manajemen proyek skala besar, petunjuk sintaksis dalam banyak editor kode, dan pengurangan ukuran kode dengan minifikasi, ini adalah cara yang tepat untuk melakukan enumerasi: variabel garis bawah-notasi.

^{wvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwv}

Seperti ditunjukkan dalam bagan di atas dan contoh di bawah, berikut adalah lima langkah mudah untuk memulai:

1. Tentukan nama untuk grup enumerasi. Pikirkan kata benda yang dapat menggambarkan tujuan pencacahan atau setidaknya entri dalam pencacahan. Misalnya, sekelompok enumerasi yang mewakili warna yang dipilih oleh pengguna mungkin lebih baik bernama COLORCHOICES daripada COLORS.
2. Putuskan apakah pencacahan dalam grup adalah saling eksklusif atau independen. Jika saling eksklusif, mulai setiap nama variabel yang disebutkan dengan ENUM_. Jika independen atau berdampingan, gunakanINDEX_ .
3. Untuk setiap entri, buat variabel lokal baru yang namanya dimulai dengan ENUM_atauINDEX_ , lalu nama grup, lalu garis bawah, lalu nama ramah unik untuk properti
4. Tambahkan ENUMLENGTH_, ENUMLEN_, INDEXLENGTH_, atau INDEXLEN_(apakah LEN_atauLENGTH_ preferensi pribadi) variabel disebutkan di akhir. Anda harus menggunakan variabel ini sedapat mungkin dalam kode Anda untuk memastikan bahwa menambahkan entri tambahan ke enumerasi dan menambah nilai ini tidak akan merusak kode Anda.
5. Berikan masing-masing variabel enumerated berturut-turut nilai satu lebih dari yang terakhir, mulai dari 0. Ada komentar di halaman ini yang mengatakan 0tidak boleh digunakan sebagai nilai disebutkan karena 0 == null, 0 == false, 0 == "", dan kegilaan lainnya JS. Saya serahkan kepada Anda bahwa, untuk menghindari masalah ini dan meningkatkan kinerja pada saat yang sama, selalu gunakan ===dan jangan pernah biarkan ==muncul dalam kode Anda kecuali dengan typeof(ex typeof X == "string"). Dalam semua tahun saya menggunakan ===, saya tidak pernah memiliki masalah dengan menggunakan 0 sebagai nilai enumerasi. Jika Anda masih mudah tersinggung, maka 1dapat digunakan sebagai nilai awal dalam ENUM_enumerasi (tetapi tidak dalam INDEX_enumerasi) tanpa penalti kinerja dalam banyak kasus.

const ENUM_COLORENUM_RED   = 0;
const ENUM_COLORENUM_GREEN = 1;
const ENUM_COLORENUM_BLUE  = 2;
const ENUMLEN_COLORENUM    = 3;

// later on

if(currentColor === ENUM_COLORENUM_RED) {
   // whatever
}

Berikut adalah bagaimana saya ingat kapan harus digunakan INDEX_dan kapan harus digunakan ENUM_:

// Precondition: var arr = []; //
arr[INDEX_] = ENUM_;

Namun, ENUM_dapat, dalam keadaan tertentu, sesuai sebagai indeks seperti ketika menghitung kejadian setiap item.

const ENUM_PET_CAT = 0,
      ENUM_PET_DOG = 1,
      ENUM_PET_RAT = 2,
      ENUMLEN_PET  = 3;

var favoritePets = [ENUM_PET_CAT, ENUM_PET_DOG, ENUM_PET_RAT,
                    ENUM_PET_DOG, ENUM_PET_DOG, ENUM_PET_CAT,
                    ENUM_PET_RAT, ENUM_PET_CAT, ENUM_PET_DOG];

var petsFrequency = [];

for (var i=0; i<ENUMLEN_PET; i=i+1|0)
  petsFrequency[i] = 0;

for (var i=0, len=favoritePets.length|0, petId=0; i<len; i=i+1|0)
  petsFrequency[petId = favoritePets[i]|0] = (petsFrequency[petId]|0) + 1|0;

console.log({
    "cat": petsFrequency[ENUM_PET_CAT],
    "dog": petsFrequency[ENUM_PET_DOG],
    "rat": petsFrequency[ENUM_PET_RAT]
});

Perhatikan bahwa, dalam kode di atas, sangat mudah untuk menambahkan jenis hewan peliharaan baru: Anda hanya perlu menambahkan entri baru setelah ENUM_PET_RATdan memperbarui ENUMLEN_PETsesuai. Mungkin lebih sulit dan sulit untuk menambahkan entri baru dalam sistem enumerasi lain.

^{wvwwvw wvwvwvw wvwxwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvww}

𝗘𝘅𝘁𝗲𝗻𝗱 𝗨𝗽𝗽𝗲𝗿𝗰𝗮𝘀𝗲 𝗩𝗮𝗿𝗶𝗮𝗯𝗹𝗲𝘀 𝗪𝗶𝘁𝗵 𝗔𝗱𝗱𝗶𝘁𝗶𝗼𝗻

Selain itu, sintaks enumerasi ini memungkinkan perluasan kelas yang jelas dan ringkas seperti yang terlihat di bawah ini. Untuk memperluas kelas, tambahkan nomor yang bertambah ke LEN_entri kelas induk. Kemudian, selesaikan subclass dengan LEN_entri sendiri sehingga subclass dapat diperpanjang lebih lanjut di masa depan.

(function(window){
    "use strict";
    var parseInt = window.parseInt;

    // use INDEX_ when representing the index in an array instance
    const INDEX_PIXELCOLOR_TYPE = 0, // is a ENUM_PIXELTYPE
          INDEXLEN_PIXELCOLOR   = 1,
          INDEX_SOLIDCOLOR_R    = INDEXLEN_PIXELCOLOR+0,
          INDEX_SOLIDCOLOR_G    = INDEXLEN_PIXELCOLOR+1,
          INDEX_SOLIDCOLOR_B    = INDEXLEN_PIXELCOLOR+2,
          INDEXLEN_SOLIDCOLOR   = INDEXLEN_PIXELCOLOR+3,
          INDEX_ALPHACOLOR_R    = INDEXLEN_PIXELCOLOR+0,
          INDEX_ALPHACOLOR_G    = INDEXLEN_PIXELCOLOR+1,
          INDEX_ALPHACOLOR_B    = INDEXLEN_PIXELCOLOR+2,
          INDEX_ALPHACOLOR_A    = INDEXLEN_PIXELCOLOR+3,
          INDEXLEN_ALPHACOLOR   = INDEXLEN_PIXELCOLOR+4,
    // use ENUM_ when representing a mutually-exclusive species or type
          ENUM_PIXELTYPE_SOLID = 0,
          ENUM_PIXELTYPE_ALPHA = 1,
          ENUM_PIXELTYPE_UNKNOWN = 2,
          ENUMLEN_PIXELTYPE    = 2;

    function parseHexColor(inputString) {
        var rawstr = inputString.trim().substring(1);
        var result = [];
        if (rawstr.length === 8) {
            result[INDEX_PIXELCOLOR_TYPE] = ENUM_PIXELTYPE_ALPHA;
            result[INDEX_ALPHACOLOR_R] = parseInt(rawstr.substring(0,2), 16);
            result[INDEX_ALPHACOLOR_G] = parseInt(rawstr.substring(2,4), 16);
            result[INDEX_ALPHACOLOR_B] = parseInt(rawstr.substring(4,6), 16);
            result[INDEX_ALPHACOLOR_A] = parseInt(rawstr.substring(4,6), 16);
        } else if (rawstr.length === 4) {
            result[INDEX_PIXELCOLOR_TYPE] = ENUM_PIXELTYPE_ALPHA;
            result[INDEX_ALPHACOLOR_R] = parseInt(rawstr[0], 16) * 0x11;
            result[INDEX_ALPHACOLOR_G] = parseInt(rawstr[1], 16) * 0x11;
            result[INDEX_ALPHACOLOR_B] = parseInt(rawstr[2], 16) * 0x11;
            result[INDEX_ALPHACOLOR_A] = parseInt(rawstr[3], 16) * 0x11;
        } else if (rawstr.length === 6) {
            result[INDEX_PIXELCOLOR_TYPE] = ENUM_PIXELTYPE_SOLID;
            result[INDEX_SOLIDCOLOR_R] = parseInt(rawstr.substring(0,2), 16);
            result[INDEX_SOLIDCOLOR_G] = parseInt(rawstr.substring(2,4), 16);
            result[INDEX_SOLIDCOLOR_B] = parseInt(rawstr.substring(4,6), 16);
        } else if (rawstr.length === 3) {
            result[INDEX_PIXELCOLOR_TYPE] = ENUM_PIXELTYPE_SOLID;
            result[INDEX_SOLIDCOLOR_R] = parseInt(rawstr[0], 16) * 0x11;
            result[INDEX_SOLIDCOLOR_G] = parseInt(rawstr[1], 16) * 0x11;
            result[INDEX_SOLIDCOLOR_B] = parseInt(rawstr[2], 16) * 0x11;
        } else {
            result[INDEX_PIXELCOLOR_TYPE] = ENUM_PIXELTYPE_UNKNOWN;
        }
        return result;
    }

    // the red component of green
    console.log(parseHexColor("#0f0")[INDEX_SOLIDCOLOR_R]);
    // the alpha of transparent purple
    console.log(parseHexColor("#f0f7")[INDEX_ALPHACOLOR_A]); 
    // the enumerated array for turquoise
    console.log(parseHexColor("#40E0D0"));
})(self);

(Panjang: 2,450 byte)

Beberapa orang mungkin mengatakan bahwa ini kurang praktis daripada solusi lain: ia membutuhkan banyak ruang, butuh waktu lama untuk menulis, dan tidak dilapisi dengan sintaksis gula. Orang-orang itu akan benar jika mereka tidak mengubah kode mereka. Namun, tidak ada orang yang berakal yang akan meninggalkan kode yang tidak ditentukan dalam produk akhir. Untuk minifikasi ini, Closure Compiler adalah yang terbaik yang belum saya temukan. Akses online dapat ditemukan di sini . Compiler Closure dapat mengambil semua data enumerasi ini dan memasangnya, membuat Javascript Anda menjadi super duper kecil dan menjalankan super duper dengan cepat. Jadi, Minify with Closure Compiler. Mengamati.

^{wvwwvw wvwvwvw wvwxwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvww}

𝗠𝗶𝗻𝗶𝗳𝘆 𝗪𝗶𝘁𝗵 𝗖𝗹𝗼𝘀𝘂𝗿𝗲 𝗖𝗼𝗺𝗽𝗶𝗹𝗲𝗿

Compiler Closure dapat melakukan beberapa optimasi yang sangat luar biasa melalui inferensi yang jauh melampaui kapasitas dari pengubah Javascript lainnya. Closure Compiler dapat inline variabel primitif diatur ke nilai tetap. Closure Compiler juga dapat membuat kesimpulan berdasarkan pada nilai yang diuraikan ini dan menghilangkan blok yang tidak digunakan dalam if-statement dan loop.

'use strict';(function(e){function d(a){a=a.trim().substring(1);var b=[];8===a.length?(b[0]=1,b[1]=c(a.substring(0,2),16),b[2]=c(a.substring(2,4),16),b[3]=c(a.substring(4,6),16),b[4]=c(a.substring(4,6),16)):4===a.length?(b[1]=17*c(a[0],16),b[2]=17*c(a[1],16),b[3]=17*c(a[2],16),b[4]=17*c(a[3],16)):6===a.length?(b[0]=0,b[1]=c(a.substring(0,2),16),b[2]=c(a.substring(2,4),16),b[3]=c(a.substring(4,6),16)):3===a.length?(b[0]=0,b[1]=17*c(a[0],16),b[2]=17*c(a[1],16),b[3]=17*c(a[2],16)):b[0]=2;return b}var c=
e.parseInt;console.log(d("#0f0")[1]);console.log(d("#f0f7")[4]);console.log(d("#40E0D0"))})(self);

(Panjang: 605 byte)

Closure Compiler memberi Anda penghargaan untuk pengkodean yang lebih cerdas dan mengorganisasikan kode Anda dengan baik karena, sementara banyak minifiers menghukum kode terorganisir dengan ukuran file yang lebih kecil, Closure Compiler dapat menyaring semua kebersihan dan kewarasan Anda untuk menghasilkan ukuran file yang lebih kecil jika Anda menggunakan trik seperti enumerasi nama variabel. Itu, dalam satu pikiran ini, adalah grail suci pengkodean: alat yang keduanya membantu kode Anda dengan ukuran yang lebih kecil dan membantu pikiran Anda dengan melatih kebiasaan pemrograman yang lebih baik.

^{wvwwvw wvwvwvw wvwxwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvww}

𝗦𝗺𝗮𝗹𝗹𝗲𝗿 𝗖𝗼𝗱𝗲 𝗦𝗶𝘇𝗲

Sekarang, mari kita lihat seberapa besar file ekuivalen tanpa enumerasi ini.

Sumber Tanpa Menggunakan Pencacahan (panjang: 1,973 byte (477 byte lebih pendek dari kode yang disebutkan!))
Diperkecil Tanpa Menggunakan Pencacahan (panjang: 843 byte ( lebih panjang 238 byte dari kode pencacahan ))

Seperti terlihat, tanpa enumerasi, kode sumber lebih pendek dengan biaya kode minified yang lebih besar. Saya tidak tahu tentang Anda; tapi saya tahu pasti bahwa saya tidak memasukkan kode sumber ke dalam produk akhir. Jadi, bentuk enumerasi ini jauh lebih unggul sehingga menghasilkan ukuran file yang lebih kecil.

^{wvwwvw wvwvwvw wvwxwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvww}

𝗖𝗼𝗼𝗽𝗲𝗿𝗮𝘁𝗶𝘃𝗲 🤝 𝗕𝘂𝗴 𝗙𝗶𝘅𝗶𝗻𝗴

Keuntungan lain tentang bentuk enumerasi ini adalah dapat digunakan untuk mengelola proyek skala besar dengan mudah tanpa mengorbankan ukuran kode yang diperkecil. Ketika mengerjakan proyek besar dengan banyak orang lain, mungkin bermanfaat untuk secara eksplisit menandai dan memberi label nama variabel dengan siapa yang membuat kode sehingga pembuat kode asli dapat dengan cepat diidentifikasi untuk memperbaiki bug kolaboratif.

// JG = Jack Giffin
const ENUM_JG_COLORENUM_RED   = 0,
      ENUM_JG_COLORENUM_GREEN = 1,
      ENUM_JG_COLORENUM_BLUE  = 2,
      ENUMLEN_JG_COLORENUM    = 3;

// later on

if(currentColor === ENUM_JG_COLORENUM_RED) {
   // whatever
}

// PL = Pepper Loftus
// BK = Bob Knight
const ENUM_PL_ARRAYTYPE_UNSORTED   = 0,
      ENUM_PL_ARRAYTYPE_ISSORTED   = 1,
      ENUM_BK_ARRAYTYPE_CHUNKED    = 2, // added by Bob Knight
      ENUM_JG_ARRAYTYPE_INCOMPLETE = 3, // added by jack giffin
      ENUMLEN_PL_COLORENUM         = 4;

// later on

if(
  randomArray === ENUM_PL_ARRAYTYPE_UNSORTED ||
  randomArray === ENUM_BK_ARRAYTYPE_CHUNKED
) {
   // whatever
}

𝗦𝘂𝗽𝗲𝗿𝗶𝗼𝗿 𝗣𝗲𝗿𝗳𝗼𝗿𝗺𝗮𝗻𝗰𝗲

Selanjutnya, bentuk enumerasi ini juga jauh lebih cepat setelah minifikasi. Dalam properti bernama normal, browser harus menggunakan hashmaps untuk mencari di mana properti itu pada objek. Meskipun kompiler JIT secara cerdas men-cache lokasi ini pada objek, masih ada overhead yang luar biasa karena kasus-kasus khusus seperti menghapus properti yang lebih rendah dari objek.

Tetapi, dengan array PACKED_ELEMENTS integer non-sparse yang diindeks terus menerus , browser dapat melewati sebagian besar overhead itu karena indeks nilai dalam array internal sudah ditentukan. Ya, menurut standar ECMAScript, semua properti seharusnya diperlakukan sebagai string. Namun demikian, aspek ini dari standar ECMAScript sangat menyesatkan tentang kinerja karena semua browser memiliki optimasi khusus untuk indeks numerik dalam array.

/// Hashmaps are slow, even with JIT juice
var ref = {};
ref.count = 10;
ref.value = "foobar";

Bandingkan kode di atas dengan kode di bawah ini.

/// Arrays, however, are always lightning fast
const INDEX_REFERENCE_COUNT = 0;
const INDEX_REFERENCE_VALUE = 1;
const INDEXLENGTH_REFERENCE = 2;

var ref = [];
ref[INDEX_REFERENCE_COUNT] = 10;
ref[INDEX_REFERENCE_VALUE] = "foobar";

Orang mungkin keberatan dengan kode dengan enumerasi yang nampaknya jauh lebih lama daripada kode dengan objek biasa, tetapi tampilannya bisa menipu. Penting untuk diingat bahwa ukuran kode sumber tidak sebanding dengan ukuran keluaran saat menggunakan Kompilator Penutupan epik. Mengamati.

/// Hashmaps are slow, even with JIT juice
var a={count:10,value:"foobar"};

Kode yang diperkecil tanpa enumerasi di atas dan kode yang diperkecil dengan enumerasi di bawah.

/// Arrays, however, are always lightning fast
var a=[10,"foobar"];

Contoh di atas menunjukkan bahwa, selain memiliki kinerja yang unggul, kode yang disebutkan juga menghasilkan ukuran file yang diperkecil lebih kecil.

^{wvwwvw wvwvwvw wvwxwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvww}

𝗘𝗮𝘀𝘆 𝗗𝗲𝗯𝘂𝗴𝗴𝗶𝗻𝗴

Selain itu, ceri pribadi yang satu ini di atas menggunakan bentuk enumerasi ini bersama dengan pengecualian CodeMirror editor teks dalam mode Javascript. Mode penyorotan Javascript CodeMirror menyoroti variabel lokal dalam cakupan saat ini. Dengan begitu, Anda langsung tahu kapan Anda mengetikkan nama variabel dengan benar karena jika nama variabel sebelumnya dinyatakan dengan ketika mengeksekusi kode dengan nama enumerasi yang salah ketik. Juga, alat JavaScript seperti JSLint dan Closure Compiler sangat keras untuk memberi tahu Anda ketika Anda salah ketik dalam nama variabel enumerasi. CodeMirror, browser, dan berbagai alat Javascript disatukan membuat debugging enumerasi bentuk ini sangat sederhana dan sangat mudah.var kata kunci, maka nama variabel tersebut akan mengubah warna khusus (cyan secara default). Bahkan jika Anda tidak menggunakan CodeMirror, maka setidaknya browser memberikan bantuan[variable name] is not defined

const ENUM_COLORENUM_RED   = 0,
      ENUM_COLORENUM_GREEN = 1,
      ENUM_COLORENUM_BLUE  = 2,
      ENUMLEN_COLORENUM    = 3;
var currentColor = ENUM_COLORENUM_GREEN;

if(currentColor === ENUM_COLORENUM_RED) {
   // whatever
}

if(currentColor === ENUM_COLORENUM_DNE) {
   // whatever
}

Dalam cuplikan di atas, Anda diberitahu dengan kesalahan karena ENUM_COLORENUM_DNEtidak ada.

^{wvwwvw wvwvwvw wvwxwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvwvww}

𝗖𝗼𝗻𝗰𝗹𝘂𝘀𝗶𝗼𝗻 ☑

Saya pikir aman untuk mengatakan bahwa metodologi enumerasi ini memang cara terbaik untuk pergi tidak hanya untuk ukuran kode yang diperkecil, tetapi juga untuk kinerja, debugging, dan kolaborasi.

^{Setelah membaca pertanyaan yang bermanfaat, saya berterima kasih kepada penulis karena telah meluangkan waktu dalam tulisan mereka dengan mengklik tanda panah kiri atas di kotak pertanyaan. Setiap kotak jawaban juga memiliki salah satu dari panah atas ini.}

Saya telah bermain-main dengan ini, karena saya suka enum saya. =)

Menggunakan Object.definePropertySaya pikir saya datang dengan solusi yang agak layak.

Inilah jsfiddle: http://jsfiddle.net/ZV4A6/

Dengan menggunakan metode ini .. Anda harus (secara teori) dapat memanggil dan menentukan nilai enum untuk objek apa pun, tanpa memengaruhi atribut lain dari objek itu.

Object.defineProperty(Object.prototype,'Enum', {
    value: function() {
        for(i in arguments) {
            Object.defineProperty(this,arguments[i], {
                value:parseInt(i),
                writable:false,
                enumerable:true,
                configurable:true
            });
        }
        return this;
    },
    writable:false,
    enumerable:false,
    configurable:false
}); 

Karena atribut writable:falseini seharusnya membuatnya aman.

Jadi, Anda harus dapat membuat objek khusus, lalu memanggilnya Enum(). Nilai yang ditetapkan mulai dari 0 dan naik per item.

var EnumColors={};
EnumColors.Enum('RED','BLUE','GREEN','YELLOW');
EnumColors.RED;    // == 0
EnumColors.BLUE;   // == 1
EnumColors.GREEN;  // == 2
EnumColors.YELLOW; // == 3

Gunakan Javascript Proxies

TLDR: Tambahkan kelas ini ke metode utilitas Anda dan gunakan di seluruh kode Anda, itu mencemooh perilaku Enum dari bahasa pemrograman tradisional, dan benar-benar melempar kesalahan ketika Anda mencoba mengakses enumerator yang tidak ada atau menambah / memperbarui enumerator. Tidak perlu bergantung Object.freeze().

class Enum {
  constructor(enumObj) {
    const handler = {
      get(target, name) {
        if (typeof target[name] != 'undefined') {
          return target[name];
        }
        throw new Error(`No such enumerator: ${name}`);
      },
      set() {
        throw new Error('Cannot add/update properties on an Enum instance after it is defined')
      }
    };

    return new Proxy(enumObj, handler);
  }
}

Kemudian buat enum dengan membuat instance kelas:

const roles = new Enum({
  ADMIN: 'Admin',
  USER: 'User',
});

Penjelasan Lengkap:

Salah satu fitur yang sangat bermanfaat dari Enums yang Anda dapatkan dari bahasa tradisional adalah bahwa mereka meledak (melemparkan kesalahan waktu kompilasi) jika Anda mencoba mengakses enumerator yang tidak ada.

Selain membekukan struktur enum yang diolok-olok untuk mencegah nilai-nilai tambahan tidak sengaja / jahat ditambahkan, tidak ada jawaban lain yang membahas fitur intrinsik dari Enum.

Seperti yang mungkin Anda ketahui, mengakses anggota yang tidak ada dalam JavaScript hanya mengembalikan undefineddan tidak meledakkan kode Anda. Karena pencacah adalah konstanta yang ditentukan sebelumnya (yaitu hari dalam seminggu), seharusnya tidak pernah ada kasus ketika pencacah harus tidak ditentukan.

Jangan salah, perilaku JavaScript untuk kembali undefinedketika mengakses properti yang tidak ditentukan sebenarnya adalah fitur bahasa yang sangat kuat, tetapi itu bukan fitur yang Anda inginkan ketika Anda mencoba untuk mengejek struktur Enum tradisional.

Di sinilah objek Proxy bersinar. Proxy distandarisasi dalam bahasa dengan diperkenalkannya ES6 (ES2015). Berikut deskripsi dari MDN:

Objek Proxy digunakan untuk menentukan perilaku kustom untuk operasi mendasar (mis. Pencarian properti, penugasan, enumerasi, pemanggilan fungsi, dll).

Mirip dengan proxy server web, proxy JavaScript dapat mencegat operasi pada objek (dengan menggunakan "jebakan", menyebutnya kait jika Anda mau) dan memungkinkan Anda untuk melakukan berbagai pemeriksaan, tindakan, dan / atau manipulasi sebelum selesai (atau dalam beberapa kasus menghentikan operasi sama sekali yang persis apa yang ingin kita lakukan jika dan ketika kita mencoba merujuk seorang enumerator yang tidak ada).

Berikut adalah contoh yang dibuat yang menggunakan objek Proxy untuk meniru Enums. Enumerator dalam contoh ini adalah Metode HTTP standar (yaitu "DAPATKAN", "POST", dll.):

// Class for creating enums (13 lines)
// Feel free to add this to your utility library in 
// your codebase and profit! Note: As Proxies are an ES6 
// feature, some browsers/clients may not support it and 
// you may need to transpile using a service like babel

class Enum {
  // The Enum class instantiates a JavaScript Proxy object.
  // Instantiating a `Proxy` object requires two parameters, 
  // a `target` object and a `handler`. We first define the handler,
  // then use the handler to instantiate a Proxy.

  // A proxy handler is simply an object whose properties
  // are functions which define the behavior of the proxy 
  // when an operation is performed on it. 
  
  // For enums, we need to define behavior that lets us check what enumerator
  // is being accessed and what enumerator is being set. This can be done by 
  // defining "get" and "set" traps.
  constructor(enumObj) {
    const handler = {
      get(target, name) {
        if (typeof target[name] != 'undefined') {
          return target[name]
        }
        throw new Error(`No such enumerator: ${name}`)
      },
      set() {
        throw new Error('Cannot add/update properties on an Enum instance after it is defined')
      }
    }


    // Freeze the target object to prevent modifications
    return new Proxy(enumObj, handler)
  }
}


// Now that we have a generic way of creating Enums, lets create our first Enum!
const httpMethods = new Enum({
  DELETE: "DELETE",
  GET: "GET",
  OPTIONS: "OPTIONS",
  PATCH: "PATCH",
  POST: "POST",
  PUT: "PUT"
})

// Sanity checks
console.log(httpMethods.DELETE)
// logs "DELETE"

try {
  httpMethods.delete = "delete"
} catch (e) {
console.log("Error: ", e.message)
}
// throws "Cannot add/update properties on an Enum instance after it is defined"

try {
  console.log(httpMethods.delete)
} catch (e) {
  console.log("Error: ", e.message)
}
// throws "No such enumerator: delete"

ASIDE: Apa itu proxy?

Saya ingat ketika saya pertama kali melihat kata proxy di mana-mana, itu jelas tidak masuk akal bagi saya untuk waktu yang lama. Jika itu Anda saat ini, saya pikir cara mudah untuk menggeneralisasi proxy adalah dengan menganggapnya sebagai perangkat lunak, institusi, atau bahkan orang yang bertindak sebagai perantara atau perantara antara dua server, perusahaan, atau orang.

Ini adalah yang lama yang saya tahu, tetapi cara itu telah dilaksanakan melalui antarmuka TypeScript adalah:

var MyEnum;
(function (MyEnum) {
    MyEnum[MyEnum["Foo"] = 0] = "Foo";
    MyEnum[MyEnum["FooBar"] = 2] = "FooBar";
    MyEnum[MyEnum["Bar"] = 1] = "Bar";
})(MyEnum|| (MyEnum= {}));

Ini memungkinkan Anda untuk mencari MyEnum.Baryang mengembalikan 1, dan MyEnum[1]yang mengembalikan "Bilah" terlepas dari urutan deklarasi.

Di ES7 , Anda dapat melakukan ENUM yang elegan dengan mengandalkan atribut statis:

class ColorEnum  {
    static RED = 0 ;
    static GREEN = 1;
    static BLUE = 2;
}

kemudian

if (currentColor === ColorEnum.GREEN ) {/*-- coding --*/}

Keuntungan (menggunakan kelas daripada objek literal) adalah memiliki kelas induk Enummaka semua Enums Anda akan memperluas kelas itu.

 class ColorEnum  extends Enum {/*....*/}

Ini adalah solusi yang saya gunakan.

function Enum() {
    this._enums = [];
    this._lookups = {};
}

Enum.prototype.getEnums = function() {
    return _enums;
}

Enum.prototype.forEach = function(callback){
    var length = this._enums.length;
    for (var i = 0; i < length; ++i){
        callback(this._enums[i]);
    }
}

Enum.prototype.addEnum = function(e) {
    this._enums.push(e);
}

Enum.prototype.getByName = function(name) {
    return this[name];
}

Enum.prototype.getByValue = function(field, value) {
    var lookup = this._lookups[field];
    if(lookup) {
        return lookup[value];
    } else {
        this._lookups[field] = ( lookup = {});
        var k = this._enums.length - 1;
        for(; k >= 0; --k) {
            var m = this._enums[k];
            var j = m[field];
            lookup[j] = m;
            if(j == value) {
                return m;
            }
        }
    }
    return null;
}

function defineEnum(definition) {
    var k;
    var e = new Enum();
    for(k in definition) {
        var j = definition[k];
        e[k] = j;
        e.addEnum(j)
    }
    return e;
}

Dan Anda mendefinisikan enum Anda seperti ini:

var COLORS = defineEnum({
    RED : {
        value : 1,
        string : 'red'
    },
    GREEN : {
        value : 2,
        string : 'green'
    },
    BLUE : {
        value : 3,
        string : 'blue'
    }
});

Dan ini adalah bagaimana Anda mengakses enum Anda:

COLORS.BLUE.string
COLORS.BLUE.value
COLORS.getByName('BLUE').string
COLORS.getByValue('value', 1).string

COLORS.forEach(function(e){
    // do what you want with e
});

Saya biasanya menggunakan 2 metode terakhir untuk memetakan enums dari objek pesan.

Beberapa keuntungan dari pendekatan ini:

• Mudah untuk mendeklarasikan enum
• Mudah mengakses enum Anda
• Enum Anda bisa menjadi tipe yang kompleks
• Kelas Enum memiliki beberapa caching asosiatif jika Anda sering menggunakan getByValue

Beberapa kelemahan:

• Beberapa manajemen memori berantakan terjadi di sana, karena saya menyimpan referensi ke enum
• Masih tidak ada tipe keselamatan

Buat objek literal:

const Modes = {
  DRAGGING: 'drag',
  SCALING:  'scale',
  CLICKED:  'click'
};

Jika Anda menggunakan Backbone , Anda bisa mendapatkan fungsionalitas enum full-blown (temukan berdasarkan id, nama, anggota kustom) secara gratis menggunakan Backbone.Collection .

// enum instance members, optional
var Color = Backbone.Model.extend({
    print : function() {
        console.log("I am " + this.get("name"))
    }
});

// enum creation
var Colors = new Backbone.Collection([
    { id : 1, name : "Red", rgb : 0xFF0000},
    { id : 2, name : "Green" , rgb : 0x00FF00},
    { id : 3, name : "Blue" , rgb : 0x0000FF}
], {
    model : Color
});

// Expose members through public fields.
Colors.each(function(color) {
    Colors[color.get("name")] = color;
});

// using
Colors.Red.print()

jawaban Anda terlalu rumit

var buildSet = function(array) {
  var set = {};
  for (var i in array) {
    var item = array[i];
    set[item] = item;
  }
  return set;
}

var myEnum = buildSet(['RED','GREEN','BLUE']);
// myEnum.RED == 'RED' ...etc

Saya telah memodifikasi solusi Andre 'Fi':

  function Enum() {
    var that = this;
    for (var i in arguments) {
        that[arguments[i]] = i;
    }
    this.name = function(value) {
        for (var key in that) {
            if (that[key] == value) {
                return key;
            }
        }
    };
    this.exist = function(value) {
        return (typeof that.name(value) !== "undefined");
    };
    if (Object.freeze) {
        Object.freeze(that);
    }
  }

Uji:

var Color = new Enum('RED', 'GREEN', 'BLUE');
undefined
Color.name(Color.REDs)
undefined
Color.name(Color.RED)
"RED"
Color.exist(Color.REDs)
false
Color.exist(Color.RED)
true

Saya datang dengan pendekatan ini yang dimodelkan setelah enum di Jawa. Ini adalah tipe-aman, sehingga Anda dapat melakukaninstanceof pemeriksaan juga.

Anda dapat mendefinisikan enum seperti ini:

var Days = Enum.define("Days", ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]);

Dayssekarang mengacu pada Daysenum:

Days.Monday instanceof Days; // true

Days.Friday.name(); // "Friday"
Days.Friday.ordinal(); // 4

Days.Sunday === Days.Sunday; // true
Days.Sunday === Days.Friday; // false

Days.Sunday.toString(); // "Sunday"

Days.toString() // "Days { Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday } "

Days.values().map(function(e) { return e.name(); }); //["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]
Days.values()[4].name(); //"Friday"

Days.fromName("Thursday") === Days.Thursday // true
Days.fromName("Wednesday").name() // "Wednesday"
Days.Friday.fromName("Saturday").name() // "Saturday"

Pelaksanaan:

var Enum = (function () {
    /**
     * Function to define an enum
     * @param typeName - The name of the enum.
     * @param constants - The constants on the enum. Can be an array of strings, or an object where each key is an enum
     * constant, and the values are objects that describe attributes that can be attached to the associated constant.
     */
    function define(typeName, constants) {

        /** Check Arguments **/
        if (typeof typeName === "undefined") {
            throw new TypeError("A name is required.");
        }

        if (!(constants instanceof Array) && (Object.getPrototypeOf(constants) !== Object.prototype)) {

            throw new TypeError("The constants parameter must either be an array or an object.");

        } else if ((constants instanceof Array) && constants.length === 0) {

            throw new TypeError("Need to provide at least one constant.");

        } else if ((constants instanceof Array) && !constants.reduce(function (isString, element) {
                return isString && (typeof element === "string");
            }, true)) {

            throw new TypeError("One or more elements in the constant array is not a string.");

        } else if (Object.getPrototypeOf(constants) === Object.prototype && !Object.keys(constants).reduce(function (isObject, constant) {
                return Object.getPrototypeOf(constants[constant]) === Object.prototype;
            }, true)) {

            throw new TypeError("One or more constants do not have an associated object-value.");

        }

        var isArray = (constants instanceof Array);
        var isObject = !isArray;

        /** Private sentinel-object used to guard enum constructor so that no one else can create enum instances **/
        function __() { };

        /** Dynamically define a function with the same name as the enum we want to define. **/
        var __enum = new Function(["__"],
            "return function " + typeName + "(sentinel, name, ordinal) {" +
                "if(!(sentinel instanceof __)) {" +
                    "throw new TypeError(\"Cannot instantiate an instance of " + typeName + ".\");" +
                "}" +

                "this.__name = name;" +
                "this.__ordinal = ordinal;" +
            "}"
        )(__);

        /** Private objects used to maintain enum instances for values(), and to look up enum instances for fromName() **/
        var __values = [];
        var __dict = {};

        /** Attach values() and fromName() methods to the class itself (kind of like static methods). **/
        Object.defineProperty(__enum, "values", {
            value: function () {
                return __values;
            }
        });

        Object.defineProperty(__enum, "fromName", {
            value: function (name) {
                var __constant = __dict[name]
                if (__constant) {
                    return __constant;
                } else {
                    throw new TypeError(typeName + " does not have a constant with name " + name + ".");
                }
            }
        });

        /**
         * The following methods are available to all instances of the enum. values() and fromName() need to be
         * available to each constant, and so we will attach them on the prototype. But really, they're just
         * aliases to their counterparts on the prototype.
         */
        Object.defineProperty(__enum.prototype, "values", {
            value: __enum.values
        });

        Object.defineProperty(__enum.prototype, "fromName", {
            value: __enum.fromName
        });

        Object.defineProperty(__enum.prototype, "name", {
            value: function () {
                return this.__name;
            }
        });

        Object.defineProperty(__enum.prototype, "ordinal", {
            value: function () {
                return this.__ordinal;
            }
        });

        Object.defineProperty(__enum.prototype, "valueOf", {
            value: function () {
                return this.__name;
            }
        });

        Object.defineProperty(__enum.prototype, "toString", {
            value: function () {
                return this.__name;
            }
        });

        /**
         * If constants was an array, we can the element values directly. Otherwise, we will have to use the keys
         * from the constants object.
         */
        var _constants = constants;
        if (isObject) {
            _constants = Object.keys(constants);
        }

        /** Iterate over all constants, create an instance of our enum for each one, and attach it to the enum type **/
        _constants.forEach(function (name, ordinal) {
            // Create an instance of the enum
            var __constant = new __enum(new __(), name, ordinal);

            // If constants was an object, we want to attach the provided attributes to the instance.
            if (isObject) {
                Object.keys(constants[name]).forEach(function (attr) {
                    Object.defineProperty(__constant, attr, {
                        value: constants[name][attr]
                    });
                });
            }

            // Freeze the instance so that it cannot be modified.
            Object.freeze(__constant);

            // Attach the instance using the provided name to the enum type itself.
            Object.defineProperty(__enum, name, {
                value: __constant
            });

            // Update our private objects
            __values.push(__constant);
            __dict[name] = __constant;
        });

        /** Define a friendly toString method for the enum **/
        var string = typeName + " { " + __enum.values().map(function (c) {
                return c.name();
            }).join(", ") + " } ";

        Object.defineProperty(__enum, "toString", {
            value: function () {
                return string;
            }
        });

        /** Freeze our private objects **/
        Object.freeze(__values);
        Object.freeze(__dict);

        /** Freeze the prototype on the enum and the enum itself **/
        Object.freeze(__enum.prototype);
        Object.freeze(__enum);

        /** Return the enum **/
        return __enum;
    }

    return {
        define: define
    }

})();

IE8 Tidak mendukung metode freeze ().
Sumber: http://kangax.github.io/compat-table/es5/ , Klik pada "Show browser usang?" di atas, dan periksa IE8 & bekukan persimpangan baris col.

Dalam proyek gim saya saat ini, saya telah menggunakan di bawah ini, karena beberapa pelanggan masih menggunakan IE8:

var CONST_WILD_TYPES = {
    REGULAR: 'REGULAR',
    EXPANDING: 'EXPANDING',
    STICKY: 'STICKY',
    SHIFTING: 'SHIFTING'
};

Kita juga bisa melakukan:

var CONST_WILD_TYPES = {
    REGULAR: 'RE',
    EXPANDING: 'EX',
    STICKY: 'ST',
    SHIFTING: 'SH'
};

atau bahkan ini:

var CONST_WILD_TYPES = {
    REGULAR: '1',
    EXPANDING: '2',
    STICKY: '3',
    SHIFTING: '4'
};

Yang terakhir, tampaknya paling efisien untuk string, ini mengurangi total bandwidth Anda jika Anda memiliki server & klien yang bertukar data ini.
Tentu saja, sekarang tugas Anda untuk memastikan tidak ada konflik dalam data (RE, EX, dll. Harus unik, juga 1, 2, dll. Harus unik). Perhatikan bahwa Anda perlu mempertahankan ini selamanya untuk kompatibilitas mundur.

Tugas:

var wildType = CONST_WILD_TYPES.REGULAR;

Perbandingan:

if (wildType === CONST_WILD_TYPES.REGULAR) {
    // do something here
}

var ColorEnum = {
    red: {},
    green: {},
    blue: {}
}

Anda tidak perlu memastikan bahwa Anda tidak menetapkan angka duplikat ke nilai enum yang berbeda dengan cara ini. Objek baru akan dipakai dan ditugaskan untuk semua nilai enum.

Berikut adalah beberapa cara berbeda untuk mengimplementasikan enum TypeScript .

Cara termudah adalah dengan hanya beralih pada objek, menambahkan pasangan nilai kunci terbalik ke objek. Satu-satunya kelemahan adalah bahwa Anda harus menetapkan nilai secara manual untuk setiap anggota.

function _enum(list) {       
  for (var key in list) {
    list[list[key] = list[key]] = key;
  }
  return Object.freeze(list);
}

var Color = _enum({
  Red: 0,
  Green: 5,
  Blue: 2
});

// Color → {0: "Red", 2: "Blue", 5: "Green", "Red": 0, "Green": 5, "Blue": 2}
// Color.Red → 0
// Color.Green → 5
// Color.Blue → 2
// Color[5] → Green
// Color.Blue > Color.Green → false

Dan ini adalah lodin mixin untuk membuat enum menggunakan string. Meskipun versi ini sedikit lebih terlibat, ia melakukan penomoran secara otomatis untuk Anda. Semua metode lodash yang digunakan dalam contoh ini memiliki standar JavaScript yang setara, sehingga Anda dapat dengan mudah mengubahnya jika Anda mau.

function enum() {
    var key, val = -1, list = {};
    _.reduce(_.toArray(arguments), function(result, kvp) {    
        kvp = kvp.split("=");
        key = _.trim(kvp[0]);
        val = _.parseInt(kvp[1]) || ++val;            
        result[result[val] = key] = val;
        return result;
    }, list);
    return Object.freeze(list);
}    

// Add enum to lodash 
_.mixin({ "enum": enum });

var Color = _.enum(
    "Red",
    "Green",
    "Blue = 5",
    "Yellow",
    "Purple = 20",
    "Gray"
);

// Color.Red → 0
// Color.Green → 1
// Color.Blue → 5
// Color.Yellow → 6
// Color.Purple → 20
// Color.Gray → 21
// Color[5] → Blue

Saya baru saja menerbitkan paket NPM gen_enum memungkinkan Anda membuat struktur data Enum dalam Javascript dengan cepat:

var genEnum = require('gen_enum');

var AppMode = genEnum('SIGN_UP, LOG_IN, FORGOT_PASSWORD');
var curMode = AppMode.LOG_IN;
console.log(curMode.isLogIn()); // output true 
console.log(curMode.isSignUp()); // output false 
console.log(curMode.isForgotPassword()); // output false 

Satu hal yang menyenangkan tentang alat kecil ini adalah di lingkungan modern (termasuk browser nodejs dan IE 9+) objek Enum yang dikembalikan tidak dapat diubah.

Untuk informasi lebih lanjut silakan checkout https://github.com/greenlaw110/enumjs

Pembaruan

Saya gen_enumpaket usang dan menggabungkan fungsi ke dalam paket constjs , yang menyediakan lebih banyak fitur termasuk objek yang tidak dapat diubah, deserialisasi string JSON, konstanta string dan pembuatan bitmap dll. Checkout https://www.npmjs.com/package/constjs untuk informasi lebih lanjut

Untuk meng-upgrade dari gen_enumke constjshanya mengubah pernyataan

var genEnum = require('gen_enum');

untuk

var genEnum = require('constjs').enum;

Solusi paling sederhana:

Membuat

var Status = Object.freeze({
    "Connecting":0,
    "Ready":1,
    "Loading":2,
    "Processing": 3
});

Dapatkan Nilai

console.log(Status.Ready) // 1

Dapatkan Kunci

console.log(Object.keys(Status)[Status.Ready]) // Ready

Saya telah membuat kelas Enum yang dapat mengambil nilai DAN nama di O (1). Itu juga dapat menghasilkan Array Objek yang berisi semua Nama dan Nilai.

function Enum(obj) {
    // Names must be unique, Values do not.
    // Putting same values for different Names is risky for this implementation

    this._reserved = {
        _namesObj: {},
        _objArr: [],
        _namesArr: [],
        _valuesArr: [],
        _selectOptionsHTML: ""
    };

    for (k in obj) {
        if (obj.hasOwnProperty(k)) {
            this[k] = obj[k];
            this._reserved._namesObj[obj[k]] = k;
        }
    }
}
(function () {
    this.GetName = function (val) {
        if (typeof this._reserved._namesObj[val] === "undefined")
            return null;
        return this._reserved._namesObj[val];
    };

    this.GetValue = function (name) {
        if (typeof this[name] === "undefined")
            return null;
        return this[name];
    };

    this.GetObjArr = function () {
        if (this._reserved._objArr.length == 0) {
            var arr = [];
            for (k in this) {
                if (this.hasOwnProperty(k))
                    if (k != "_reserved")
                        arr.push({
                            Name: k,
                            Value: this[k]
                        });
            }
            this._reserved._objArr = arr;
        }
        return this._reserved._objArr;
    };

    this.GetNamesArr = function () {
        if (this._reserved._namesArr.length == 0) {
            var arr = [];
            for (k in this) {
                if (this.hasOwnProperty(k))
                    if (k != "_reserved")
                        arr.push(k);
            }
            this._reserved._namesArr = arr;
        }
        return this._reserved._namesArr;
    };

    this.GetValuesArr = function () {
        if (this._reserved._valuesArr.length == 0) {
            var arr = [];
            for (k in this) {
                if (this.hasOwnProperty(k))
                    if (k != "_reserved")
                        arr.push(this[k]);
            }
            this._reserved._valuesArr = arr;
        }
        return this._reserved._valuesArr;
    };

    this.GetSelectOptionsHTML = function () {
        if (this._reserved._selectOptionsHTML.length == 0) {
            var html = "";
            for (k in this) {
                if (this.hasOwnProperty(k))
                    if (k != "_reserved")
                        html += "<option value='" + this[k] + "'>" + k + "</option>";
            }
            this._reserved._selectOptionsHTML = html;
        }
        return this._reserved._selectOptionsHTML;
    };
}).call(Enum.prototype);

Anda dapat menggunakannya seperti ini:

var enum1 = new Enum({
    item1: 0,
    item2: 1,
    item3: 2
});

Untuk mengambil nilai (seperti Enums di C #):

var val2 = enum1.item2;

Untuk mengambil nama untuk suatu nilai (dapat bersifat mendua ketika menempatkan nilai yang sama untuk nama yang berbeda):

var name1 = enum1.GetName(0);  // "item1"

Untuk mendapatkan array dengan setiap nama & nilai dalam suatu objek:

var arr = enum1.GetObjArr();

Akan menghasilkan:

[{ Name: "item1", Value: 0}, { ... }, ... ]

Anda juga bisa mendapatkan opsi pemilihan html dengan mudah:

var html = enum1.GetSelectOptionsHTML();

Yang berlaku:

"<option value='0'>item1</option>..."

Meskipun hanya metode statis (dan bukan properti statis) yang didukung dalam ES2015 (lihat di sini juga, §15.2.2.2), anehnya Anda dapat menggunakan di bawah ini dengan Babel dengan es2015preset:

class CellState {
    v: string;
    constructor(v: string) {
        this.v = v;
        Object.freeze(this);
    }
    static EMPTY       = new CellState('e');
    static OCCUPIED    = new CellState('o');
    static HIGHLIGHTED = new CellState('h');
    static values      = function(): Array<CellState> {
        const rv = [];
        rv.push(CellState.EMPTY);
        rv.push(CellState.OCCUPIED);
        rv.push(CellState.HIGHLIGHTED);
        return rv;
    }
}
Object.freeze(CellState);

Saya menemukan ini berfungsi seperti yang diharapkan bahkan di seluruh modul (misalnya mengimpor CellStateenum dari modul lain) dan juga ketika saya mengimpor modul menggunakan Webpack.

Keuntungan metode ini memiliki lebih dari sebagian besar jawaban lain adalah bahwa Anda dapat menggunakannya bersama pemeriksa tipe statis (misalnya Flow ) dan Anda dapat menegaskan, pada saat pengembangan menggunakan pengecekan tipe statis, bahwa variabel, parameter, dll. Anda adalah spesifikCellState " enum "daripada enum lain (yang tidak mungkin dibedakan jika Anda menggunakan objek atau simbol umum).

memperbarui

Kode di atas memiliki kekurangan karena memungkinkan seseorang untuk membuat objek tipe tambahan CellState(walaupun seseorang tidak dapat menetapkannya ke bidang statis CellStatesejak dibekukan). Namun, kode lebih halus di bawah ini menawarkan keuntungan sebagai berikut:

1. tidak ada lagi objek bertipe CellStatedapat dibuat
2. Anda dijamin tidak ada dua instance enum yang diberi kode yang sama
3. metode utilitas untuk mendapatkan enum kembali dari representasi string

4. yang valuesfungsi yang kembali semua contoh enum tidak harus menciptakan nilai kembali di atas, pengguna (dan rawan kesalahan) cara.

   'use strict';
   
   class Status {
   
   constructor(code, displayName = code) {
       if (Status.INSTANCES.has(code))
           throw new Error(`duplicate code value: [${code}]`);
       if (!Status.canCreateMoreInstances)
           throw new Error(`attempt to call constructor(${code}`+
          `, ${displayName}) after all static instances have been created`);
       this.code        = code;
       this.displayName = displayName;
       Object.freeze(this);
       Status.INSTANCES.set(this.code, this);
   }
   
   toString() {
       return `[code: ${this.code}, displayName: ${this.displayName}]`;
   }
   static INSTANCES   = new Map();
   static canCreateMoreInstances      = true;
   
   // the values:
   static ARCHIVED    = new Status('Archived');
   static OBSERVED    = new Status('Observed');
   static SCHEDULED   = new Status('Scheduled');
   static UNOBSERVED  = new Status('Unobserved');
   static UNTRIGGERED = new Status('Untriggered');
   
   static values      = function() {
       return Array.from(Status.INSTANCES.values());
   }
   
   static fromCode(code) {
       if (!Status.INSTANCES.has(code))
           throw new Error(`unknown code: ${code}`);
       else
           return Status.INSTANCES.get(code);
   }
   }
   
   Status.canCreateMoreInstances = false;
   Object.freeze(Status);
   exports.Status = Status;

es7 way, (iterator, freeze), penggunaan:

const ThreeWiseMen = new Enum('Melchior', 'Caspar', 'Balthazar')

for (let name of ThreeWiseMen)
    console.log(name)


// with a given key
let key = ThreeWiseMen.Melchior

console.log(key in ThreeWiseMen) // true (string conversion, also true: 'Melchior' in ThreeWiseMen)

for (let entry from key.enum)
     console.log(entry)


// prevent alteration (throws TypeError in strict mode)
ThreeWiseMen.Me = 'Me too!'
ThreeWiseMen.Melchior.name = 'Foo'

kode:

class EnumKey {

    constructor(props) { Object.freeze(Object.assign(this, props)) }

    toString() { return this.name }

}

export class Enum {

    constructor(...keys) {

        for (let [index, key] of keys.entries()) {

            Object.defineProperty(this, key, {

                value: new EnumKey({ name:key, index, enum:this }),
                enumerable: true,

            })

        }

        Object.freeze(this)

    }

    *[Symbol.iterator]() {

        for (let key of Object.keys(this))
            yield this[key]

    }

    toString() { return [...this].join(', ') }

}

Ini adalah bagaimana typescript menerjemahkannya enumke dalam Javascript:

var makeEnum = function(obj) {
    obj[ obj['Active'] = 1 ] = 'Active';
    obj[ obj['Closed'] = 2 ] = 'Closed';
    obj[ obj['Deleted'] = 3 ] = 'Deleted';
}