0Pricing
TypeScript Academy · Pelajaran

Tipe Union dan Literal (pengantar penyempitan dasar)

Gabungkan tipe dengan union, gunakan tipe literal untuk nilai yang tepat, dan terapkan penyempitan dasar.

Tipe Union dan Literal (pengantar penyempitan dasar) adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 3 dari 3. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar TypeScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus TypeScript Academy mencakup 3 pelajaran total.

Pengantar

Tujuan: Pelajari cara menggabungkan beberapa tipe dengan union dan membatasi nilai menggunakan tipe literal. Keduanya membantu membuat API yang lebih aman.

Dasar-dasar union

Tipe union menggunakan | untuk mengizinkan salah satu dari beberapa tipe. Dalam contoh ini: string atau number.

let value: string | number;
value = "hello";

value = 42;

// value = true; 
// Error, not allowed

Tipe literal

Tipe literal membatasi nilai ke pilihan yang persis ditentukan. Tipe ini umum digunakan untuk konfigurasi dan enum.

let direction: "left" | "right";
direction = "left";

// direction = "up";
 // Error

Dasar-dasar penyempitan tipe

Penyempitan tipe memeriksa tipe saat runtime (misalnya, typeof) agar anggota dapat diakses dengan aman.

function printId(id: string | number) {
  if (typeof id === "string") {
    console.log(id.toUpperCase());
  } else {
    console.log(id.toFixed(2));
  }
}

printId("abc");
printId(123.456);

Union terdiskriminasi

Union terdiskriminasi menggabungkan tag literal dengan objek. Penyempitan berdasarkan kind membuat TypeScript dapat memahami tipe dengan cerdas.

type Shape =
  | { kind: "circle"; radius: number }
  | { kind: "square"; size: number };

function area(shape: Shape): number {
  if (shape.kind === "circle") {
    return Math.PI * shape.radius ** 2;
  } else {
    return shape.size * shape.size;
  }
}

console.log(area({ kind: "circle", radius: 2 }));
console.log(area({ kind: "square", size: 3 }));

Mengapa menggunakan union & literal

Mengapa menggunakan union & literal? Keduanya membuat keadaan yang tidak valid menjadi mustahil, membantu pelengkapan otomatis, dan memungkinkan kompiler menemukan kesalahan lebih awal.

Pemeriksaan union

Pemeriksaan singkat: Apa yang dimaksud dengan tipe union?

Ringkasan

Ringkasan: Gunakan | untuk union, tipe literal untuk nilai yang persis, dan penyempitan tipe untuk membuat percabangan dengan aman. Perkakas ini membuat TS ekspresif dan aman.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Tipe Union dan Literal (pengantar penyempitan dasar)” gratis?

Ya — teks lengkap “Tipe Union dan Literal (pengantar penyempitan dasar)” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus TypeScript Academy, upgrade ke CoddyKit PRO. Kursus TypeScript Academy mencakup 3 pelajaran total.

Apa yang akan aku pelajari di “Tipe Union dan Literal (pengantar penyempitan dasar)”?

Gabungkan tipe dengan union, gunakan tipe literal untuk nilai yang tepat, dan terapkan penyempitan dasar. Kamu berlatih TypeScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai TypeScript Academy?

Tidak diperlukan pengalaman sebelumnya. TypeScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 3 dari 3.

Berapa lama pelajaran “Tipe Union dan Literal (pengantar penyempitan dasar)” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. Tipe Primitif dan Anotasi
  2. Inferensi Tipe dan any vs unknown
  3. Tipe Union dan Literal (pengantar penyempitan dasar)
← Kembali ke TypeScript Academy