Pengantar Tipe Pemetaan

Tipe pemetaan memungkinkan Anda mengubah tipe yang sudah ada menjadi tipe baru dengan menerapkan operasi pada setiap properti dalam suatu tipe.

Tipe ini sangat berguna untuk membuat struktur tipe yang fleksibel dan dapat digunakan kembali dalam TypeScript.

Apa Itu Tipe Pemetaan?

Tipe pemetaan menggunakan sintaks seperti { [P in keyof T]: T[P] } untuk melakukan iterasi pada properti suatu tipe T.

Contoh Dasar Tipe Pemetaan

Berikut contoh sederhana cara menggunakan tipe pemetaan untuk membuat versi hanya-baca dari suatu tipe:

type User = {
  name: string;
  age: number;
};

type ReadonlyUser = {
  readonly [P in keyof User]: User[P];
};

Menggunakan Tipe Pemetaan Bawaan

TypeScript menyediakan beberapa tipe pemetaan bawaan, seperti:

• Readonly<T>: Menjadikan semua properti T hanya-baca.
• Partial<T>: Menjadikan semua properti T opsional.
• Required<T>: Menjadikan semua properti T wajib.

type User = {
  name: string;
  age: number;
};

// Example of Partial
const user: Partial<User> = {
  name: 'John',
};

Melakukan Pemetaan pada Tipe Gabungan

Tipe pemetaan juga dapat digunakan dengan tipe gabungan untuk membuat tipe baru yang merupakan gabungan:

type Status = 'active' | 'inactive';

type StatusFlags = {
  [K in Status]: boolean;
};

const flags: StatusFlags = {
  active: true,
  inactive: false,
};

Tipe Pemetaan Bersyarat

Anda dapat menggunakan tipe bersyarat bersama tipe pemetaan untuk membuat transformasi tipe yang lebih kompleks.

type User = {
  name: string;
  age?: number;
};

type NonOptional<T> = {
  [K in keyof T]-?: T[K];
};

type RequiredUser = NonOptional<User>;

Contoh Lanjutan: Mengecualikan Properti

Berikut cara membuat tipe pemetaan untuk mengecualikan properti tertentu:

type User = {
  id: number;
  name: string;
  password: string;
};

type PublicUser = {
  [K in keyof User as Exclude<K, 'password'>]: User[K];
};

Tugas Latihan

Buat tipe pemetaan yang menambahkan pengubah readonly ke semua properti tipe Product. Uji dengan mendeklarasikan variabel bertipe baru tersebut.

Selamat!

Anda telah mempelajari cara menggunakan tipe terpetakan untuk mengubah tipe yang sudah ada menjadi tipe baru secara dinamis. Latih teknik-teknik ini agar kode TypeScript Anda menjadi lebih canggih!