TypeScript merupakan sebuah alat yang ampuh untuk pengembangan aplikasi JavaScript, namun salah satu fitur yang seringkali menimbulkan kebingungan bagi para pengembang adalah konsep generics. Generics bisa tampak menakutkan dengan adanya kurung sudut dan variabel seperti T, K, V yang mungkin tidak akan langsung masuk akal pada awalnya. Namun, jangan khawatir! Melalui blog post ini, kamu akan memahami segala hal tentang generics dengan cara yang sederhana sehingga kamu bisa menguasainya dengan cepat.
Table of contents
Open Table of contents
Apa itu Generics?
Mari kembali ke topik kita, yaitu generics. Mengapa kita menggunakan generics? Bayangkan kamu memiliki sebuah fungsi yang bertujuan untuk mengambil elemen pertama dari sebuah array. Ketika kau mengoper array yang berisi angka, fungsi akan mengembalikan angka tanpa masalah. Namun, bagaimana jika kamu ingin fungsi tersebut bisa mengoper array string atau tipe lainnya?
Di sinilah generics menjadi penting. Generics memungkinkan kamu untuk menuliskan fungsi atau tipe yang dapat beradaptasi dengan berbagai jenis tipe data. Sebagai contoh, kamu bisa membuat sebuah fungsi getFirstElement yang menggunakan generics melalui penambahan kurung sudut setelah nama fungsi dan penentuan nama tipe generik, seperti
function getFirstElement<ElementType>(array: ElementType[]): ElementType {
return array[0];
}Dengan fungsi generik ini, kamu dapat dengan mudah memanggilnya dengan tipe data array apa pun – bisa berupa array of numbers atau array of strings – dan fungsi tersebut akan mengembalikan elemen pertama dengan tipe data yang sesuai.
Generics juga sangat berguna saat bekerja dengan objek map atau set. Kamu dapat mendefinisikan tipe data kunci dan nilai pada waktu kompilasi, dan TypeScript akan memastikan bahwa kamu hanya menggunakan tipe data yang sesuai saat kamu menambahkan atau mengambil item dari map atau set tersebut.
Selain itu, kamu bisa membuat tipe yang generik. Sebagai contoh, saat bekerja dengan API, seringkali respons yang diterima memiliki struktur yang serupa tetapi menyertakan data yang berbeda-beda. Dengan menggunakan tipe generik, kamu bisa mendefinisikan sebuah tipe APIResponse yang mencakup data dan error, dengan data bisa menjadi apa saja yang kamu tentukan nantinya:
type APIResponse<DataType> = {
data: DataType;
isError: boolean;
};Lebih jauh lagi, kamu dapat menentukan nilai default untuk generics, sehingga kamu tidak perlu mendefinisikan tipe generik setiap kali menggunakan tipe tersebut. Ini sangat berguna untuk situasi di mana tipe generik akan sering digunakan dengan tipe data yang sama.
Untuk kasus di mana kamu ingin membatasi jenis tipe data yang diperbolehkan dalam generics, TypeScript menyediakan kemampuan untuk memperluas tipe tertentu, memastikan bahwa data yang diteruskan sesuai dengan konstrain tipe yang telah ditentukan.
Generics mungkin memang membingungkan di awal, tapi dengan latihan dan pemahaman yang baik, kamu akan melihat betapa fleksibel dan kuatnya fitur ini dalam pengembangan aplikasi TypeScript. Jadi, jangan takut untuk bereksperimen dengan generics dan melihat berbagai cara kamu dapat menggunakan fitur ini untuk membuat kode yang lebih dinamis dan aman tipe.
Untuk pembelajaran yang lebih mendalam tentang TypeScript dan semua fitur pentingnya, termasuk generics, pastikan untuk mendaftar pada kursus TypeScript Simplified saya. Dalam waktu kurang dari 5 jam, kamu akan memiliki pengetahuan dan keterampilan yang diperlukan untuk mulai menggunakan TypeScript dalam proyek-proyekmu dan mengambil langkah lebih dekat untuk mewujudkan impian projekmu.
Terima kasih telah membaca, dan jangan lupa untuk mempraktekkan penggunaan generics dalam kode TypeScript mu! Selamat belajar!