Cara Menggunakan Enum di TypeScript

Enum, atau tipe enumerasi, adalah struktur data yang memungkinkan Anda menentukan sekumpulan nilai bernama.

Enum menyediakan cara untuk merepresentasikan sekumpulan nilai tetap sebagai konstanta. Mereka dapat membantu membuat kode Anda lebih ekspresif dan mendokumentasikan diri dengan memberikan nama yang bermakna untuk nilai tertentu. Di sini Anda akan belajar bagaimana Anda dapat menggunakan enum di TypeScript.

Membuat Enum

Enum umumnya mewakili sejumlah opsi tetap untuk nilai yang diberikan. Misalnya, enum yang mewakili warna primer mungkin memiliki nilai tetap untuk Merah, Kuning, dan Biru.

Enum mewakili data sebagai sekumpulan pasangan kunci/nilai yang dikenal sebagai anggota enum. Kuncinya harus selalu berupa string. Namun, nilai—angka yang bertambah secara otomatis secara default—dapat berupa numerik, string, atau dihitung.

Anda dapat membuat enum di bahasa TypeScript menggunakan

enum kata kunci. Ikuti dengan nama enum dan sepasang kurung kurawal ({}) yang berisi anggota enum. Konvensi penamaan JavaScript umum menyatakan bahwa nama enum harus dimulai dengan huruf kapital.

enum Arah {
 Ke atas,
 Turun,
 Kiri,
 Benar
}

Contoh ini menampilkan enum yang disebut Arah. Enum memiliki anggota yang mewakili setiap arah: Atas, Bawah, Kiri, dan Kanan.

Karena kode ini tidak menentukan nilai untuk setiap kunci, TypeScript akan secara otomatis memberikan nilai. Anggota pertama, Up, akan memiliki nilai 0. Anggota yang tersisa masing-masing akan memiliki nilai 1 lebih besar dari anggota sebelumnya. Anda dapat secara eksplisit mendeklarasikan ini jika Anda merasa sulit untuk mengingatnya:

enum Arah {
 Atas = 0,
 Bawah = 1,
 Kiri = 2,
 Benar = 3,
}

Atau Anda dapat secara eksplisit mendeklarasikan nilai yang berbeda, meninggalkan nilai yang tidak dideklarasikan untuk terus bertambah seperti sebelumnya:

enum Status {
 Aktif = 9,
 Tidak aktif, // 10
}

Dalam contoh ini, anggota yang tidak aktif memiliki nilai 10. Perilaku ini berlaku untuk enum yang hanya memiliki nilai numerik, bukan yang memiliki anggota string atau heterogen.

Berbagai Jenis Enum

Enum dalam TypeScript memiliki tipe implisit yang didasarkan pada tipe nilai yang dimiliki anggotanya. Jenis yang paling umum adalah enum numerik, yang perilakunya dibahas di bagian sebelumnya, tetapi ada dua variasi.

String Enum

Enum string adalah enum yang semua anggotanya adalah string. Tidak seperti enum numerik, di mana nilai ditetapkan secara otomatis, Anda harus menginisialisasi setiap anggota dengan string:

enum Warna Primer {
 Merah = "MERAH",
 Kuning = "KUNING",
 Biru = "BIRU"
}

Meskipun enum string tidak memiliki properti penambahan otomatis, mereka mungkin lebih masuk akal jika Anda membuat cerita bersambung. Nilainya harus tetap deskriptif, tanpa nama anggota, sementara satu set nilai numerik mungkin tidak menggambarkan dirinya sendiri.

Enum Heterogen

Enum heterogen adalah enum yang berisi anggota numerik dan string. Misalnya:

enum Hasil {
 Sukses = "KESUKSESAN",
 Kegagalan = 0
}

Enum heterogen berguna ketika Anda memiliki anggota enum yang memerlukan jenis nilai berbeda berdasarkan konteks atau makna spesifik setiap anggota. Namun, Dokumentasi TypeScript mencegah penggunaan enum heterogen karena memperkenalkan kompleksitas yang dapat membuat kode Anda lebih rawan kesalahan.

Anggota Enum yang Dihitung dan Konstan

Setiap anggota enum memiliki nilai, yang bisa konstan atau dihitung.

Anggota Enum Konstan

Anggota enum konstan jika memenuhi salah satu kondisi di bawah ini.

1. Ini adalah anggota pertama enum dan tidak memiliki penginisialisasi.
2. Itu tidak memiliki penginisialisasi, dan anggota enum sebelumnya adalah konstanta numerik.
3. Itu diinisialisasi dengan ekspresi enum konstan.

Menurut dokumentasi TypeScript, Ekspresi enum konstan adalah subset dari ekspresi TypeScript yang dapat dievaluasi sepenuhnya pada waktu kompilasi. Misalnya, string atau literal numerik.

Misalnya, anggota enum di blok kode di bawah semuanya konstan:

// KASUS 1
enum Arah {
 Ke atas,
 Turun,
 Kiri,
 Benar
}
// KASUS 2
enum Hari kerja {
 Senin = 1,
 Selasa,
 Rabu,
 Kamis,
 Jumat
}
// KASUS 3
enum Musim {
 musim semi = "MUSIM SEMI",
 Musim panas = "MUSIM PANAS",
 Musim gugur = "MUSIM GUGUR",
 Musim Dingin = "MUSIM DINGIN"
}

Saat Anda mengubah anggota enum konstan menjadi JavaScript biasa, kode yang dihasilkan menggunakan nilai literalnya. Ini dapat bermanfaat untuk kinerja dan mempermudah proses debug.

Misalnya, inilah versi enum Musim yang diubah:

var Musim;
(fungsi (Musim) {
 Musim["Musim semi"] = "MUSIM SEMI";
 Musim["Musim panas"] = "MUSIM PANAS";
 Musim["Musim gugur"] = "MUSIM GUGUR";
 Musim["Musim dingin"] = "MUSIM DINGIN";
})(Musim || (Musim = {}));

Anggota Enum yang Dihitung

Anda dapat menggunakan anggota enum yang dihitung untuk menetapkan nilai ke anggota enum berdasarkan ekspresi atau perhitungan dinamis lainnya. Misalnya:

enum Ukuran {
 Kecil = 1,
 Sedang = hitungUkuran(12),
 Besar = hitungUkuran(5)
}
fungsimenghitungUkuran(nilai: nomor): nomor{
kembali nilai * 5;
}
menghibur.log (Ukuran. Besar)

Itu Ukuran enum memiliki tiga anggota: Kecil, Sedang, Dan Besar. Ini secara eksplisit memberikan nilai 1 ke anggota Kecil. Itu Sedang Dan Besar anggota menggunakan fungsi menghitungUkuran untuk menghitung nilainya saat runtime.

Saat bekerja dengan anggota enum yang dihitung, penting untuk diperhatikan bahwa nilainya tidak diketahui hingga runtime. Ini dapat memperkenalkan lebih banyak kompleksitas dan potensi kesalahan waktu proses dibandingkan dengan anggota enum dengan nilai konstan.

Misalnya:

var Ukuran;
(fungsi (Ukuran) {
 Ukuran[Ukuran["Kecil"] = 1] = "Kecil";
 Ukuran[Ukuran["Sedang"] = hitungUkuran(12)] = "Sedang";
 Ukuran[Ukuran["Besar"] = hitungUkuran(5)] = "Besar";
})(Ukuran || (Ukuran = {}));
menghibur.catatan(Ukuran.Besar)

Blok kode di atas adalah versi transpilasi dari Ukuran enum. Perhatikan bagaimana TypeScript tidak menyertakan nilai kembalian dari countSize() dalam kode JavaScript. Sebaliknya, ini menyertakan pemanggilan fungsi asli sehingga JavaScript menentukan nilai saat runtime.

Mengakses Nilai Enum

Anda dapat mengakses nilai anggota enum menggunakan notasi titik objek.

Misalnya:

enum Arah {
 Atas = 0,
 Bawah = 1,
 Kiri = 2,
 Benar = 3,
}
menghibur.log (Arah. Kiri) // 2

Enum Numerik Pemetaan Terbalik

Pemetaan terbalik dalam enum numerik mengacu pada kemampuan untuk mengambil nama anggota enum yang sesuai dari nilainya. Ini bisa sangat berguna saat bekerja dengan nilai numerik, yang mungkin perlu Anda dekode.

Secara default, nilai enum di TypeScript dipetakan ke depan, artinya Anda hanya dapat mengakses nilai yang terkait dengan nama. Namun, Anda dapat melakukan pemetaan terbalik secara manual untuk mengambil anggota enum berdasarkan nilainya.

Misalnya:

enum Arah {
 Atas = 1,
 Turun,
 Kiri,
 Benar
}
fungsigetDirectionName(Nilai arah: nomor): rangkaian{
// Membalikkan pemetaan
const namaarah = Arah[nilaiarah];
kembali namaarah;
}
menghibur.log (getDirectionName(1)); // "Ke atas"
menghibur.log (getDirectionName(3)); // "Kiri"

Ini getDirectionName fungsi melakukan pemetaan terbalik dengan mengakses nama anggota enum menggunakan nilainya sebagai indeks. Fungsi mengambil a nilaiarah sebagai argumen dan mengambil nama anggota enum yang sesuai menggunakan Arah[nilaiarah].

Pemetaan terbalik dapat berguna dalam skenario di mana Anda memiliki nilai numerik dan perlu menentukan nama anggota enum yang sesuai. Ini memberikan cara mudah untuk bekerja dengan enum dalam arah maju dan mundur.

Ada Banyak Aplikasi Enum

Anda dapat menggunakan enum dalam berbagai skenario, seperti menangani pernyataan sakelar, menentukan parameter fungsi, memetakan data, dan merepresentasikan pilihan atau setelan.

Baik Anda perlu merepresentasikan serangkaian opsi terbatas atau mengelola transisi keadaan kompleks, enum di TypeScript adalah alat yang berharga untuk meningkatkan kejelasan dan struktur kode Anda.