Tanda Tangan Indeks versus Record
Pilih antara tanda tangan indeks dan jenis utilitas Record.
Tanda Tangan Indeks versus Record 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.
Dua Cara Memberi Tipe pada Kamus
TypeScript menyediakan dua cara umum untuk menjelaskan kamus: tanda tangan indeks seperti { [k: string]: V }, dan tipe utilitas bawaan Record<K, V>. Keduanya sangat tumpang tindih, tetapi cara bacanya berbeda.
Tipe Utilitas Record
Record<K, V> membentuk tipe objek yang keys-nya adalah K dan nilainya adalah V. Dengan string sebagai kunci, tipe ini setara dengan tanda tangan indeks teks.
type Scores = Record<string, number>
const game: Scores = { alice: 10, bob: 7 }
console.log(game.alice)Setara dengan Tanda Tangan Indeks
Kedua tipe ini menjelaskan bentuk yang sama. Record<string, number> dan { [key: string]: number } dapat dipertukarkan untuk keys teks sembarang.
type A = Record<string, number>
type B = { [key: string]: number }
const a: A = { x: 1 }
const b: B = a // assignable both ways
console.log(b.x)Record dengan Gabungan Kunci Literal
Kekuatan sebenarnya Record terlihat saat digunakan dengan gabungan kunci literal yang terbatas. Tipe ini menghasilkan objek yang setiap keys-nya wajib ada—sesuatu yang tidak dapat dinyatakan oleh tanda tangan indeks.
type Role = "admin" | "editor" | "viewer"
type Perms = Record<Role, boolean>
const p: Perms = { admin: true, editor: true, viewer: false }
console.log(p.admin)Kunci yang Hilang Terdeteksi
Karena setiap kunci literal wajib ada, melupakan salah satunya menyebabkan galat kompilasi. Ini adalah jaminan kuat yang tidak dapat diberikan oleh tanda tangan indeks.
type Role = "admin" | "editor" | "viewer"
// const bad: Record<Role, boolean> = { admin: true, editor: true }
// Error: property viewer is missingTanda Tangan Indeks Mengizinkan Kunci Apa Pun
Sebaliknya, tanda tangan indeks bersifat terbuka. Anda dapat menambahkan keys yang tidak pernah disebutkan di mana pun, dan tidak ada yang wajib tersedia.
type Open = { [key: string]: number }
const o: Open = {} // no keys required
o.anything = 1 // any key allowed
console.log(o.anything)Kumpulan Kunci Terbatas: Pilih Record
Jika keys merupakan kumpulan yang diketahui dan terbatas, Record dengan gabungan literal lebih jelas dan aman. Tipe ini mendokumentasikan keys yang benar-benar ada dan menegakkan kelengkapan.
type Direction = "north" | "south" | "east" | "west"
type Moves = Record<Direction, number>
const m: Moves = { north: 1, south: 0, east: 2, west: 0 }
console.log(m.east)Kumpulan Kunci Terbuka: Keduanya Dapat Digunakan
Jika keys tidak terbatas dan ditemukan saat waktu berjalan, Record<string, V> maupun tanda tangan indeks dapat digunakan. Banyak tim memilih Record karena ringkas, sedangkan yang lain memilih tanda tangan karena lebih eksplisit.
type Cache1 = Record<string, string>
type Cache2 = { [url: string]: string }
const c: Cache1 = {}
c["/home"] = "<html>"
console.log(c["/home"])Record Hanyalah Tipe Terpetakan
Di balik layar, Record<K, V> didefinisikan sebagai tipe terpetakan: { [P in K]: V }. Mengetahui hal ini menjelaskan mengapa gabungan literal menghasilkan keys wajib, sedangkan string menghasilkan tanda tangan indeks.
// lib definition (simplified):
// type Record<K extends string | number | symbol, V> = { [P in K]: V }
type Flags = Record<"a" | "b", boolean>
const f: Flags = { a: true, b: false }
console.log(f.a)Kunci Bernama dan Penampung Semua
Tanda tangan indeks dapat menggabungkan penampung semua dengan keys tetap dalam satu antarmuka—berguna ketika Anda membutuhkan keduanya. Record saja tidak dapat menggabungkan keys bernama yang wajib dengan penampung semua terbuka dengan cara yang sama bersihnya.
interface Response {
status: number
[header: string]: number | string
}
const r: Response = { status: 200, "x-id": "abc" }
console.log(r.status)Memilih dalam Praktik
Aturan praktis: keys yang terbatas dan diketahui → Record<Union, V> untuk memeriksa kelengkapan. Keys tak terbatas → gunakan bentuk mana pun. Membutuhkan keys bernama dan penampung semua → gunakan tanda tangan indeks di dalam antarmuka.
type Status = "ok" | "error"
type Messages = Record<Status, string>
const msg: Messages = { ok: "done", error: "failed" }
console.log(msg.ok)Pemeriksaan Singkat
Uji pemahaman Anda tentang Record dan tanda tangan indeks.
Rangkuman
Record<string, V> sama dengan tanda tangan indeks teks, tetapi Record dengan gabungan kunci literal menjadikan setiap kunci yang tercantum wajib ada dan mendeteksi penghilangan saat waktu kompilasi. Gunakan Record<Union, V> untuk keys terbatas yang diketahui, bentuk mana pun untuk keys tak terbatas, dan tanda tangan indeks ketika Anda membutuhkan keys bernama serta penampung semua. Di balik layar, Record adalah tipe terpetakan { [P in K]: V }.
Belajar TypeScript dengan tutor AI — gratis
Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.
- Kursus
- 101
- Pelajaran
- 352
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Tanda Tangan Indeks versus Record” gratis?
Ya — teks lengkap “Tanda Tangan Indeks versus Record” 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 “Tanda Tangan Indeks versus Record”?
Pilih antara tanda tangan indeks dan jenis utilitas Record. 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 “Tanda Tangan Indeks versus Record” 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
- Mendefinisikan Tanda Tangan Indeks
- Tanda Tangan Indeks String versus Number
- Menggabungkan Kunci yang Diketahui dan Dinamis
- Tanda Tangan Indeks versus Record