Pola satisfies Praktis
Terapkan satisfies pada objek konfigurasi dan tabel pencarian.
Pola satisfies Praktis adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 4 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.
Memvalidasi Palet Warna
Pola yang umum adalah satisfies Record<string, Color> untuk palet: setiap nilai diperiksa agar merupakan warna yang valid, sementara kunci tetap exact untuk pelengkapan otomatis.
type Color = "red" | "green" | "blue";
const palette = {
primary: "blue",
secondary: "green"
} satisfies Record<string, Color>;
console.log(palette.primary);Menemukan Nilai Palet yang Tidak Valid
Jika suatu nilai bukan Color yang valid, satisfies menghasilkan kesalahan, sementara kuncinya tetap memiliki tipe yang presisi.
type Color = "red" | "green" | "blue";
// const bad = { primary: "purple" } satisfies Record<string, Color>; // Error
const ok = { primary: "red" } satisfies Record<string, Color>;
console.log(ok.primary);Mempertahankan Pelengkapan Otomatis Kunci
Karena kunci hasil inferensi adalah "primary" | "secondary", editor Anda dapat melengkapinya secara otomatis, tidak seperti anotasi Record biasa yang akan kehilangan kunci spesifik.
type Color = "red" | "green" | "blue";
const palette = { primary: "red", accent: "blue" } satisfies Record<string, Color>;
// palette.<autocomplete: primary, accent>
console.log(palette.accent);Memvalidasi Peta Rute
Peta rute juga mendapatkan manfaat: nilainya harus sesuai dengan bentuk penangan, sementara nama rute tetap diketahui untuk pembantu navigasi.
type Route = { method: "GET" | "POST"; path: string };
const routes = {
home: { method: "GET", path: "/" },
login: { method: "POST", path: "/login" }
} satisfies Record<string, Route>;
console.log(routes.login.method);Mengindeks ke Dalam Peta
Dengan kunci yang dipertahankan, Anda dapat membuat tipe nama rute yang valid dan mengindeks ke dalam peta dengan keamanan tipe.
type Route = { method: string; path: string };
const routes = {
home: { method: "GET", path: "/" },
about: { method: "GET", path: "/about" }
} satisfies Record<string, Route>;
type RouteName = keyof typeof routes; // "home" | "about"
const pick: RouteName = "about";
console.log(routes[pick].path);Konfigurasi Bertipe dengan Nilai Campuran
satisfies juga berfungsi saat nilai memiliki bentuk yang berbeda. Batasi dengan tipe gabungan, lalu setiap nilai akan divalidasi terhadapnya.
type Setting = number | boolean | string;
const config = {
retries: 3,
verbose: true,
region: "eu"
} satisfies Record<string, Setting>;
console.log(config.retries, config.verbose);Tabel Pencarian Seperti Enum
Buat tabel pencarian yang divalidasi terhadap suatu tipe nilai, sambil mempertahankan setiap entri secara exact untuk digunakan nanti.
type Status = "active" | "inactive";
const userStatus = {
alice: "active",
bob: "inactive"
} satisfies Record<string, Status>;
const s: "active" = userStatus.alice;
console.log(s);Memadukan dengan as const
Gabungkan as const dan satisfies untuk data yang tidak dapat diubah secara mendalam dan tervalidasi: as const membekukannya, sedangkan satisfies memeriksanya.
type Color = "red" | "blue";
const theme = {
primary: "red",
secondary: "blue"
} as const satisfies Record<string, Color>;
console.log(theme.primary);Memvalidasi Rentang Numerik berdasarkan Tipe
Anda dapat membatasi nilai ke gabungan literal numerik untuk memodelkan kumpulan opsi tetap yang divalidasi saat definisinya dibuat.
type Level = 1 | 2 | 3;
const levels = {
easy: 1,
medium: 2,
hard: 3
} satisfies Record<string, Level>;
console.log(levels.hard);Peta Penanda Fitur
Contoh praktis konfigurasi penanda fitur: kuncinya adalah nama penanda yang dapat Anda lengkapi secara otomatis, sedangkan nilainya berupa boolean yang divalidasi oleh satisfies.
const flags = {
newDashboard: true,
betaSearch: false
} satisfies Record<string, boolean>;
type Flag = keyof typeof flags;
const f: Flag = "betaSearch";
console.log(flags[f]);Mengapa Pola Ini Unggul
Untuk palet, rute, dan penanda, satisfies Record<...> memberikan nilai yang tervalidasi serta kunci dan literal yang presisi, titik keseimbangan yang ideal untuk konfigurasi bertipe sehari-hari.
type Color = "red" | "green" | "blue";
const ui = { brand: "green", warn: "red" } satisfies Record<string, Color>;
console.log(Object.keys(ui).join(","));Pemeriksaan Singkat: satisfies Praktis
Uji pemahaman Anda tentang pola satisfies yang praktis.
Ringkasan: Pola satisfies Praktis
Anda menerapkan satisfies Record<string, Color> pada palet, peta rute, penanda, dan tabel pencarian, dengan mempertahankan kunci dan literal exact untuk pelengkapan otomatis sekaligus memvalidasi setiap nilai.
type Color = "red" | "blue";
const theme = { bg: "blue", fg: "red" } satisfies Record<string, Color>;
console.log(theme.bg, theme.fg);Pertanyaan yang Sering Diajukan
Apakah pelajaran “Pola satisfies Praktis” gratis?
Ya — teks lengkap “Pola satisfies Praktis” 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 “Pola satisfies Praktis”?
Terapkan satisfies pada objek konfigurasi dan tabel pencarian. 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 4 dari 4.
Berapa lama pelajaran “Pola satisfies Praktis” 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
- Mengapa satisfies Ada
- satisfies versus Anotasi Jenis
- satisfies versus Pernyataan as
- Pola satisfies Praktis