KuloDev
1 Hari
0 XP
advanced20 menitModul: 02-typescript-foundations

TypeScript Generics & Utility Types

Menulis komponen dan fungsi yang fleksibel untuk berbagai tipe data dengan Generics (`<T>`) serta memanfaatkan `Partial`, `Pick`, `Omit`.

1. Apa itu Generics (`<T>`)?

Generics adalah cara membuat fungsi, class, atau interface yang dapat bekerja dengan berbagai macam tipe data tanpa kehilangan keselamatan tipe (type safety). Bayangkan Generics seperti parameter untuk tipe data.

Fungsi Generic Respons API
typescript
1// Wrapper API generik yang bisa membungkus tipe data apa saja
2interface ApiResponse<TData> {
3 success: boolean;
4 status: number;
5 data: TData;
6 error?: string;
7}
8
9interface User { id: string; name: string; }
10interface Course { id: string; title: string; }
11
12// Penggunaan nyata:
13const userResponse: ApiResponse<User> = {
14 success: true,
15 status: 200,
16 data: { id: "u1", name: "Budi" }
17};
18
19const courseResponse: ApiResponse<Course[]> = {
20 success: true,
21 status: 200,
22 data: [{ id: "c1", title: "Programming Core" }]
23};

2. Utility Types Populer di TypeScript

TypeScript menyediakan fungsi manipulasi tipe bawaan yang sangat berguna:

Partial, Pick, dan Omit
typescript
1interface Article {
2 id: string;
3 title: string;
4 content: string;
5 author: string;
6 createdAt: Date;
7}
8
9// 1. Partial: Membuat semua field menjadi opsional (cocok untuk operasi UPDATE)
10type UpdateArticleDto = Partial<Article>;
11
12// 2. Pick: Mengambil hanya beberapa field tertentu
13type ArticleCardPreview = Pick<Article, "id" | "title" | "author">;
14
15// 3. Omit: Mengambil semua field KECUALI yang disebutkan
16type CreateArticleDto = Omit<Article, "id" | "createdAt">;
Kuis Pemahaman
+10 XP

Jika kamu memiliki `interface User { id: string; email: string; passwordHash: string; }` dan ingin membuat tipe untuk profil publik yang TIDAK memiliki `passwordHash`, utility type apa yang paling tepat?

Selesaikan Materi Ini?

Dapatkan +25 XP dan simpan progres belajarmu.