TypeScript: Perbedaan Type dan Interface (Mana yang Dipilih?)

Dua Cara Mendefinisikan Bentuk Data

Saat kamu beranjak dari JavaScript ke TypeScript, tugas utamamu adalah mendefinisikan bentuk tipe data (seperti memberi tahu *editor* bahwa "Objek User ini harus punya nama bertipe teks dan umur bertipe angka").

Masalahnya, TypeScript memberikan DUA cara yang berbeda untuk melakukan hal yang sama: menggunakan kata kunci interface atau type (Type Alias). Hal ini sering memicu perdebatan sengit di kalangan developer pemula.

Mengenal Sintaks Keduanya

Secara bentuk, keduanya nyaris identik. Perhatikan contoh berikut:

// Menggunakan Interface
interface UserInterface {
  nama: string;
  umur: number;
}

// Menggunakan Type
type UserType = {
  nama: string;
  umur: number;
};

Keduanya bekerja dengan sempurna untuk mendeklarasikan sebuah objek. Lalu apa bedanya?

Kekuatan Interface: Mudah Diwariskan (Extends)

Interface sangat kental dengan nuansa *Object-Oriented Programming* (OOP). Ia dirancang khusus untuk mendeklarasikan bentuk sebuah Objek (tidak bisa digunakan untuk tipe data primitif tunggal seperti *string* atau *number*).

Kekuatan utama Interface adalah ia sangat mudah "diwariskan" (Extends) dan digabungkan (Declaration Merging). Jika kamu mendeklarasikan dua interface dengan nama yang sama persis, TypeScript tidak akan error, melainkan akan menggabungkan isinya secara otomatis.

Kekuatan Type: Super Fleksibel (Union & Intersection)

Berbeda dengan Interface, Type ibarat variabel tipe data yang sangat bebas. Kamu bisa menggunakan Type untuk membuat tipe data gabungan (Union) yang tidak bisa dilakukan oleh Interface.

// Hanya bisa dilakukan oleh Type!
type StatusPesanan = "Pending" | "Dikirim" | "Selesai";

type ID = string | number; // Bisa teks atau angka

Kesimpulan: Aturan Pakai di Dunia Nyata

Pada TypeScript versi modern (versi 4 ke atas), perbedaan keduanya sudah sangat tipis. Keduanya sama-sama berkinerja tinggi. Namun, sebagai Best Practice (Standar Industri), gunakan aturan ini:

1. Gunakan interface sebagai pilihan utama secara default saat kamu mendefinisikan *Props* komponen React, atau saat kamu membuat struktur Objek *Database*. (Karena lebih rapi dan kodenya lebih cepat di-compile oleh mesin).
2. Gunakan type HANYA JIKA kamu butuh fitur spesifik seperti Union (penggabungan pilihan data pakai garis lurus |) atau untuk memetakan tipe data primitif tunggal.