0Pricing
TypeScript Academy · Pelajaran

T extends U ? X : Y dalam praktik

Tulis tipe kondisional praktis; pelajari distribusi atas union dan cara menonaktifkannya bila diperlukan.

T extends U ? X : Y dalam praktik adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 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.

Pendahuluan

Tujuan: Gunakan tipe kondisional untuk menyatakan logika dalam sistem tipe dan pahami kapan tipe tersebut didistribusikan ke seluruh gabungan.

  • Pola: T extends U ? X : Y
  • Distribusi: menerapkan cabang pada setiap anggota gabungan

Pola dasar

Tipe kondisional memilih cabang berdasarkan apakah T dapat ditetapkan ke string.

type IsString<T> = T extends string ? true : false

type A = IsString<string>
//   ^ true

type B = IsString<number>
//   ^ false

Distribusi

Dengan T tanpa pembungkus, pemeriksaan berjalan pada setiap anggota gabungan: string | number menjadi string[] | number[].

type ToArray<T> = T extends any ? T[] : never

type C = ToArray<string | number>
// distributes:
// C is string[] | number[]

Menonaktifkan distribusi

Bungkus T dalam tuple ([T]) untuk mencegah distribusi dan memperlakukan gabungan sebagai satu kesatuan.

type ToArrayNoDist<T> = [T] extends [any] ? T[] : never

type D = ToArrayNoDist<string | number>
// no distribution:
// D is (string | number)[]

Utilitas dunia nyata

Contoh pola: Untuk larik, ElementType menggunakan infer untuk mengekstrak elemen; jika tidak, tipe dibiarkan apa adanya.

type NonEmptyArray<T> = T[] extends [] ? never : T[]
// Usually better:
// type ElementType<T> = T extends ReadonlyArray<infer U> ? U : T

type E1 = ElementType<string[]>
//   ^ string

type E2 = ElementType<readonly number[]>
//   ^ number

type E3 = ElementType<string>
//   ^ string

Kiat

Kiat: Jaga kondisi tetap sederhana; perhatikan penerapan; gunakan kembali tipe pembantu; sertakan berkas pengujian untuk kombinasi yang kompleks.

// Tips
// - Keep conditions simple; deep nesting harms readability
// - Document distribution behavior for teammates
// - Prefer helper aliases (ElementType, Awaited) for reuse
// - Watch for De Morgan like logic when composing unions

Pemeriksaan distribusi

Pemeriksaan singkat: Kapan tipe kondisional didistribusikan?

Ringkasan

Ringkasan: Tipe kondisional memodelkan logika dalam tipe. Distribusi diterapkan pada setiap anggota gabungan; gunakan pembungkus tuple untuk menonaktifkannya.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “T extends U ? X : Y dalam praktik” gratis?

Ya — teks lengkap “T extends U ? X : Y dalam praktik” 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 “T extends U ? X : Y dalam praktik”?

Tulis tipe kondisional praktis; pelajari distribusi atas union dan cara menonaktifkannya bila diperlukan. 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 1 dari 3.

Berapa lama pelajaran “T extends U ? X : Y dalam praktik” 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. T extends U ? X : Y dalam praktik
  2. infer untuk utilitas mirip ReturnType
  3. Bawaan: ReturnType, Parameters, InstanceType, dll.
← Kembali ke TypeScript Academy