TypeScript Academy · Pelajaran

Antarmuka Fluent dengan Jenis

Rangkai metode sambil melacak status yang terakumulasi dalam jenis.

Antarmuka Fluent dengan Jenis adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 2 dari 4. 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 4 pelajaran total.

Melacak yang Telah Ditetapkan

Pembangun biasa memungkinkan Anda memanggil build() kapan saja, bahkan ketika bidang wajib belum diisi. Kita dapat melakukan yang lebih baik dengan melacak keadaan yang terakumulasi dalam sistem tipe menggunakan parameter tipe generik.

Parameter Tipe Keadaan

Kita memberikan pembangun sebuah S generik yang mencatat kunci mana yang telah diberikan sejauh ini. Setiap kali metode dijalankan, kita memperluas S agar mencakup kunci baru.

class Builder<S> {
  // S is a record of keys set so far, e.g. {} or { url: string }
  private data: Record<string, unknown> = {};
}

Setiap Metode Menambahkan Kunci

Sebuah penyetel mengembalikan pembangun baru yang bertipe dan S-nya mencakup kunci yang baru ditambahkan. Saat program berjalan, nilainya disimpan; tipe tersebut diperluas sesuai kebutuhan.

  set<K extends string, V>(key: K, value: V): Builder<S & Record<K, V>> {
    this.data[key] = value;
    return this as unknown as Builder<S & Record<K, V>>;
  }

Trik Irisan

Ekspresi S & Record<K, V> mengiriskan keadaan sebelumnya dengan kunci baru. Setelah dua panggilan, tipe tersebut mengetahui kedua kunci secara tepat.

type Empty = {};
type AfterUrl = Empty & Record<"url", string>;
type AfterBoth = AfterUrl & Record<"method", string>;
// AfterBoth = { url: string; method: string }

Pembangun Lancar yang Konkret

Di sini, pembangun permintaan meneruskan bentuk yang terakumulasi melalui setiap panggilan. Kompiler selalu mengetahui bidang mana yang benar-benar ada.

class Req<S> {
  private d: Record<string, unknown> = {};
  url(u: string): Req<S & { url: string }> {
    this.d.url = u; return this as any;
  }
  method(m: string): Req<S & { method: string }> {
    this.d.method = m; return this as any;
  }
}

Tipe Bertambah saat Anda Merangkai

Setiap panggilan dalam rangkaian menghasilkan tipe pembangun yang lebih spesifik. Dengan mengarahkan kursor ke hasilnya di penyunting, Anda dapat melihat keadaan yang terakumulasi.

const partial = new Req<{}>().url("/x");
// type: Req<{ url: string }>
const full = partial.method("POST");
// type: Req<{ url: string; method: string }>

Mengapa Melacak Keadaan?

Setelah tipe membawa kumpulan kunci yang telah diberikan, kita dapat membatasi build() agar hanya dapat dikompilasi ketika kunci wajib tersedia. Parameter keadaan menjadi dasar jaminan tersebut.

Membaca Bentuk yang Terakumulasi

Anda dapat mengekstrak bentuk yang terakumulasi untuk memeriksanya. Ini memastikan bahwa tipe pembangun benar-benar mencerminkan hal yang telah dikonfigurasi.

type StateOf<T> = T extends Req<infer S> ? S : never;
type S1 = StateOf<Req<{ url: string }>>; // { url: string }

Saat Berjalan Tetap Sederhana

Semua kecanggihan berada di dalam tipe. Saat program berjalan, setiap penyetel hanya menyimpan nilai di dalam objek. Konversi tipe (as any) menjembatani objek saat berjalan dengan tipe waktu kompilasi yang lebih kaya.

const r = new Req<{}>().url("/users").method("GET");
console.log("configured url and method");

Keadaan Generik sebagai Buku Catatan

Anggaplah S sebagai buku catatan tentang hal-hal yang telah ditetapkan. Metode menambahkan catatan; pada langkah build nanti, buku catatan tersebut dapat dibaca untuk menentukan apakah konstruksi diizinkan.

Kompromi

Pelacakan keadaan pada tingkat tipe memberikan umpan balik yang tepat dari penyunting pengembangan dan mencegah build yang tidak lengkap, dengan konsekuensi beberapa konversi tipe dan generik yang lebih tingkat lanjut. Manfaatnya sepadan untuk antarmuka yang digunakan banyak orang.

Pemeriksaan Singkat

Pemeriksaan singkat tentang pelajaran ini.

Rangkuman

Pembangun bertipe yang lancar membawa parameter keadaan generik S. Setiap penyetel mengiriskan S dengan kunci baru (S & Record<K, V>) dan mengembalikan pembangun yang lebih spesifik, sehingga kompiler memiliki buku catatan yang tepat tentang bidang yang telah dikonfigurasi.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Antarmuka Fluent dengan Jenis” gratis?

Ya — teks lengkap “Antarmuka Fluent dengan Jenis” 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 4 pelajaran total.

Apa yang akan aku pelajari di “Antarmuka Fluent dengan Jenis”?

Rangkai metode sambil melacak status yang terakumulasi dalam jenis. 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 2 dari 4.

Berapa lama pelajaran “Antarmuka Fluent dengan Jenis” 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

← Kembali ke TypeScript Academy