Belajar TypeScript - Tipe Array, Tuple, dan Enum

#Pendahuluan

Episode 5 menamai bentuk objek tunggal. Episode 6 bergerak ke data yang berjumlah banyak: koleksi nilai, pasangan dengan makna berbeda, dan daftar pilihan yang tetap. Tiga tipe ini muncul di hampir semua aplikasi nyata, dari daftar produk sampai koordinat peta.

Array menyimpan banyak nilai sejenis, tuple menyimpan beberapa nilai dengan urutan dan tipe yang dijamin, sedangkan enum menyediakan kelompok konstanta bernama. Masing-masing menjawab kebutuhan yang berbeda, dan salah pilih bisa membuat model data sulit dipakai.

Episode 6 mengupas sintaks, varian readonly, dan kasus penggunaan setiap tipe. Kalian juga akan melihat kenapa komunitas TypeScript modern cenderung memilih union literal daripada enum untuk sebagian besar kebutuhan.

#Tipe Array

#Dua Sintaks yang Setara

Array ditulis dengan dua cara yang hasilnya sama:

let angka: number[] = [1, 2, 3];
let kata: Array<string> = ["satu", "dua"];
 
let matriks: number[][] = [[1, 2], [3, 4]];

Deklarasi let angka: number[] = [1, 2, 3]; membuat array yang hanya boleh berisi number. Bentuk Array<string> identik dengan string[], jadi pilih salah satu dan konsisten. Operasi seperti push dan map tetap tersedia, dan compiler memastikan tidak ada elemen dengan tipe lain yang masuk.

#Readonly Array

Kalau array tidak akan diubah setelah dibuat, kunci dengan ReadonlyArray atau akhiran readonly:

const daftarBaca: readonly number[] = [1, 2, 3];
const daftarLain: ReadonlyArray<string> = ["a", "b"];
 
function jumlah(total: readonly number[]): number {
    return total.reduce((acc, n) => acc + n, 0);
}

Variabel daftarBaca tidak bisa di-push atau dihapus isinya. Menandai parameter sebagai readonly juga menyampaikan maksud: fungsi hanya membaca, tidak memodifikasi, sehingga pemanggil merasa aman.

#Tuple

#Pasangan Nilai dengan Panjang Tetap

Tuple adalah array dengan tipe elemen yang berbeda dan panjang yang diketahui:

let koordinat: [number, number] = [10, 20];
let pasangan: [string, number] = ["populasi", 300_000];
 
koordinat[0] = 15;
koordinat.push(30);

Deklarasi let koordinat: [number, number]; menjamin elemen pertama dan kedua bertipe number. Tuple berguna untuk pasangan nilai seperti koordinat, kunci dan nilai, atau hasil dari fungsi yang mengembalikan banyak nilai. Akan tetapi, metode yang mengubah panjang seperti push masih lolos, jadi perlakuan readonly perlu dipasang kalau panjang benar-benar tetap.

#Labeled Tuple dan Elemen Opsional

Tuple modern bisa diberi label agar jelas, dengan elemen opsional di akhir:

type Hasil = [sukses: boolean, data?: string];
 
function proses(): Hasil {
    return [true, "ok"];
}

Label tidak mengubah perilaku, hanya membantu keterbacaan. Elemen opsional menandai bahwa bagian akhir tuple boleh tidak ada. Tuple labeled paling sering dipakai sebagai tipe kembalian fungsi yang membutuhkan beberapa nilai sekaligus tanpa membuat objek.

#Enum

#Numeric Enum dan String Enum

Enum menyediakan kelompok konstanta bernama dengan dua bentuk utama:

enum StatusOrder {
    Baru,
    Diproses,
    Selesai,
}
 
enum Warna {
    Merah = "merah",
    Hijau = "hijau",
    Biru = "biru",
}

Enum numerik tanpa inisialisasi otomatis diberi nilai 0, 1, 2, dan seterusnya. String enum lebih jelas saat di-log atau dikirim ke server karena menyimpan teks yang bermakna. Keduanya memudahkan penulisan, tapi menyimpan risiko berupa kode tambahan yang dihasilkan compiler dan mudahnya salah memakai nilai.

#Const Enum dan Alternatif Literal

Modifier const menghapus objek runtime yang dihasilkan enum:

const enum Metode {
    Get = "GET",
    Post = "POST",
}

Const enum dipakai langsung sebagai literal saat kompilasi sehingga tidak menghasilkan kode runtime. Meski efisien, const enum bermasalah dengan isolatedModules. Karena itu banyak codebase memilih union literal yang dibahas di episode 4:

Union literal memberi nilai string yang transparan, tanpa kode runtime, dan tetap tervalidasi penuh oleh compiler. Itulah sebabnya dokumentasi resmi TypeScript sendiri kini lebih menyarankan union literal ketimbang enum.

#Penutup

Episode 6 melengkapi perbendaharaan tipe kalian untuk data jamak: array untuk kumpulan sejenis, tuple untuk pasangan tetap, dan enum untuk konstanta bernama. Kalian juga tahu kapan harus mengunci koleksi dengan readonly dan kapan beralih ke union literal.

Inti yang harus dibawa pulang:

• number[] dan Array<number> adalah dua cara menulis array yang setara.
• readonly number[] mencegah array diubah setelah dibuat.
• Tuple mengunci tipe tiap elemen sesuai posisi, misalnya [number, number].
• Labeled tuple membuat pasangan nilai yang kembalian fungsi mudah dibaca.
• Enum numerik otomatis bernomor; string enum lebih transparan.
• Union literal umumnya lebih baik daripada enum untuk status aplikasi.

Di episode 7 selanjutnya kita akan membahas fungsi dengan tipe, parameter opsional, dan default, yaitu cara menegakkan kontrak argumen dan nilai balik agar fungsi aman dipanggil dari mana saja.