TypeScript Academy · Pelajaran

Pemisahan String Tingkat Jenis

Pisahkan string menjadi tuple di dalam sistem jenis.

Pemisahan String Tingkat 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.

Tipe Literal Templat

Sistem tipe dapat mencocokkan pola pada tipe literal string menggunakan tipe literal templat yang dipadukan dengan infer. Ini adalah alat utama untuk penguraian string tingkat tipe.

Notasi: TypeScript nyata menulis tipe literal templat menggunakan string yang dibatasi tanda kutip terbalik dan berisi celah dolar-kurung kurawal. Dalam cuplikan ini, kami menampilkan pola tersebut sebagai Tpl<...>, dengan mencantumkan setiap bagian secara berurutan; misalnya, templat tanda kutip terbalik yang mencocokkan awalan literal lalu Rest ditampilkan sebagai Tpl<'prefix', infer Rest>.

type StartsWithA<S> = S extends Tpl<'a', string> ? true : false;
// Tpl<'a', string> is a backtick template literal type: 'a' then anything

type X = StartsWithA<'abc'>; // true
type Y = StartsWithA<'bcd'>; // false

Menyimpulkan Sufiks

Tempatkan infer di dalam templat untuk menangkap bagian dari string. Di sini, kami menangkap semua hal setelah awalan "a".

type AfterA<S> = S extends Tpl<'a', infer Rest> ? Rest : never;
// Tpl<'a', Rest> captures everything after a leading 'a'

type X = AfterA<'abc'>; // 'bc'

Memisahkan dengan Pembatas

Untuk memisahkan string pada kemunculan pertama sebuah pemisah, cocokkan pola "kepala, pemisah, ekor" dan simpulkan kedua sisinya. Kecocokan pertama yang ditemukan digunakan karena inferensi untuk bagian kepala bersifat rakus dari kiri.

type SplitOnce<S, Sep extends string> =
  S extends Tpl<infer Head, Sep, infer Tail>
    ? [Head, Tail]
    : [S];
// Tpl<Head, Sep, Tail> matches up to the first separator

type X = SplitOnce<'a-b-c', '-'>; // ['a', 'b-c']

Pemisahan Rekursif

Untuk memisahkan menjadi semua bagian, lakukan rekursi pada bagian ekor. Kumpulkan setiap kepala ke dalam tuple hingga tidak ada pemisah yang tersisa.

type Split<S extends string, Sep extends string> =
  S extends Tpl<infer Head, Sep, infer Tail>
    ? [Head, ...Split<Tail, Sep>]
    : [S];
// recurse on Tail until no separator remains

type X = Split<'a.b.c', '.'>; // ['a', 'b', 'c']

Menelusuri Rekursi

Telusuri Split<"a.b.c", ".">:

Kepala "a", ekor "b.c" -> ["a", ...Split<"b.c">]
Kepala "b", ekor "c" -> ["b", ...Split<"c">]
"c" tidak memiliki ".", kasus dasar -> ["c"]

Hasil: ["a", "b", "c"].

type X = Split<"one,two", ",">; // ["one", "two"]
type Y = Split<"x/y/z", "/">; // ["x", "y", "z"]

Menangani Segmen Kosong

Pemisahan dapat menghasilkan string kosong ketika pemisah berdampingan atau berada di tepi. Polanya tetap cocok dan menyimpulkan Head atau Tail yang kosong.

type X = Split<"a,,b", ",">; // ["a", "", "b"]
type Y = Split<",a", ",">;   // ["", "a"]

Menggabungkan Kembali

Kebalikan dari pemisahan adalah penggabungan: telusuri tuple string dan gabungkan dengan pemisah menggunakan literal templat. Keduanya secara alami saling melengkapi.

type Join<T extends string[], Sep extends string> =
  T extends [infer H extends string, ...infer R extends string[]]
    ? R extends [] ? H : Tpl<H, Sep, Join<R, Sep>>
    : '';
// Tpl<...> denotes a template literal type concatenation

type X = Join<['a', 'b', 'c'], '-'>; // 'a-b-c'

Menghapus Spasi Putih

Utilitas string dapat disusun. Tipe Trim menghapus spasi di awal dan akhir dengan berulang kali menghilangkan spasi melalui inferensi templat.

type TrimLeft<S extends string> =
  S extends Tpl<' ', infer R> ? TrimLeft<R> : S;
type TrimRight<S extends string> =
  S extends Tpl<infer R, ' '> ? TrimRight<R> : S;
type Trim<S extends string> = TrimRight<TrimLeft<S>>;
// Tpl<' ', R> strips a leading space; Tpl<R, ' '> strips a trailing one

type X = Trim<'  hi  '>; // 'hi'

Mengganti Substring

Penggantian dilakukan dengan memisahkan string di sekitar target, lalu menggabungkannya kembali dengan pengganti, semuanya melalui inferensi templat dan rekursi.

type ReplaceAll<S extends string, From extends string, To extends string> =
  S extends Tpl<infer A, From, infer B>
    ? Tpl<A, To, ReplaceAll<B, From, To>>
    : S;
// split around From, then rejoin with To via template literal types

type X = ReplaceAll<'a-b-c', '-', '_'>; // 'a_b_c'

Mengapa Pemisahan Penting

Pemisahan adalah dasar penguraian terstruktur. Rute dipisahkan pada "/", string query dipisahkan pada "&", dan baris CSV dipisahkan pada ",". Dengan Split, Anda mengubah tipe string datar menjadi tuple yang dapat diproses elemen demi elemen.

type Segments = Split<"users/42/posts", "/">; // ["users", "42", "posts"]

Perhatian terhadap Kedalaman

Rekursi string tingkat tipe dibatasi oleh batas kedalaman kompiler. String yang sangat panjang atau banyak pemisah dapat melampaui batas tersebut. Untuk masukan umum, seperti jalur dan format kecil, cara ini berjalan lancar.

type Ok = Split<"a/b/c/d/e", "/">; // fine for small strings

Uji Cepat

Uji pemahaman Anda tentang pemisahan string tingkat tipe.

Rangkuman

Anda telah memisahkan string sepenuhnya dalam tipe.

Tipe literal templat dan infer mencocokkan serta menangkap bagian-bagian string.
SplitOnce memisahkan pada pemisah pertama; rekursi menghasilkan Split yang lengkap.
Join, Trim, dan ReplaceAll dapat disusun dari alat yang sama.

Berikutnya: mengekstrak data terstruktur dari tipe string.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Pemisahan String Tingkat Jenis” gratis?

Ya — teks lengkap “Pemisahan String Tingkat 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 “Pemisahan String Tingkat Jenis”?

Pisahkan string menjadi tuple di dalam sistem 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 “Pemisahan String Tingkat 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