Tipe Gabungan dan Tipe Irisan

Selamat datang di pelajaran berikutnya! Dalam pelajaran ini, Anda akan mempelajari cara menggunakan tipe gabungan agar sebuah variabel dapat memiliki beberapa tipe yang mungkin dan tipe irisan untuk menggabungkan beberapa tipe menjadi satu. Keduanya merupakan alat yang ampuh untuk membuat kode yang fleksibel dan tangguh. Mari kita mulai!

Apa Itu Tipe Gabungan?

Tipe gabungan memungkinkan sebuah variabel menyimpan lebih dari satu tipe. Anda dapat menggunakan simbol | untuk mendefinisikan tipe gabungan.

Contoh: Sebuah variabel yang dapat berupa teks atau angka:

Tugas: Deklarasikan sebuah variabel dengan tipe gabungan dan tetapkan nilai yang berbeda padanya.

let value: string | number;
value = "Hello";
console.log(value); // Output: "Hello"

value = 42;
console.log(value); // Output: 42

Menggunakan Tipe Gabungan dalam Fungsi

Anda dapat menggunakan tipe gabungan pada parameter fungsi agar fungsi menerima beberapa jenis masukan. Contoh:

Tugas: Tulis fungsi yang menerima parameter bertipe gabungan dan mencatatnya ke konsol.

function printValue(value: string | number): void {
  console.log(`The value is ${value}`);
}

printValue("Hello"); // Output: The value is Hello
printValue(100); // Output: The value is 100

Apa Itu Tipe Irisan?

Tipe irisan menggabungkan beberapa tipe menjadi satu. Anda dapat menggunakan simbol & untuk mendefinisikan tipe irisan.

Contoh: Menggabungkan dua tipe objek:

Tugas: Buat tipe irisan untuk menggabungkan dua objek dan gunakan tipe tersebut.

type Person = { name: string };
type Employee = { employeeId: number };

type Staff = Person & Employee;

let staffMember: Staff = {
  name: "Alice",
  employeeId: 123,
};

console.log(staffMember);

Menggunakan Penjaga Tipe dengan Tipe Gabungan

TypeScript tidak mengetahui tipe mana yang sedang Anda gunakan dalam tipe gabungan. Anda dapat menggunakan penjaga tipe untuk mempersempit tipe. Contoh:

Tugas: Gunakan penjaga tipe untuk menangani berbagai tipe dalam sebuah tipe gabungan.

function display(value: string | number): void {
  if (typeof value === "string") {
    console.log(`String value: ${value.toUpperCase()}`);
  } else {
    console.log(`Number value: ${value * 2}`);
  }
}

display("Hello"); // Output: String value: HELLO
display(5); // Output: Number value: 10

Tipe Irisan dalam Praktik

Tipe irisan berguna saat bekerja dengan objek yang memiliki properti yang sama. Contoh:

Tugas: Buat tipe irisan untuk menggabungkan peran admin dan pengguna.

type Admin = { adminLevel: string };
type User = { username: string };

type AdminUser = Admin & User;

let admin: AdminUser = {
  adminLevel: "super",
  username: "admin123",
};

console.log(`Admin ${admin.username} has level ${admin.adminLevel}`);

Kesalahan Umum pada Tipe Gabungan dan Tipe Irisan

Berikut beberapa kesalahan umum:

• Menggunakan tipe gabungan, tetapi tidak menangani semua kemungkinan kasus (misalnya, lupa menggunakan penjaga tipe).
• Membuat tipe terlalu rumit dengan irisan yang tidak diperlukan.
• Menetapkan nilai yang tidak kompatibel ke tipe gabungan atau tipe irisan.

Tips: Selalu uji kode Anda untuk memastikan tipe-tipe tersebut berfungsi sesuai harapan!

Kapan Menggunakan Tipe Gabungan dan Tipe Irisan

Gunakan tipe gabungan ketika:

• Sebuah variabel dapat memiliki salah satu dari beberapa tipe yang mungkin.
• Anda memerlukan fleksibilitas pada parameter fungsi.

Gunakan tipe irisan ketika:

• Menggabungkan beberapa objek atau tipe menjadi satu.
• Membuat tipe yang lebih kompleks untuk kasus penggunaan tertentu.

Bagus Sekali!

Selamat! Anda telah mempelajari cara menggunakan tipe gabungan dan tipe irisan untuk menangani skenario kompleks di TypeScript. Alat-alat ini membuat kode Anda lebih fleksibel dan ekspresif. Pada pelajaran berikutnya, kita akan mempelajari enumerasi dan cara enumerasi membantu mengelola nilai konstan. Mari terus menulis kode!