TypeScript Academy · Pelajaran

Menggabungkan Kunci Diketahui dan Dinamik

Campurkan sifat tetap dengan tandatangan indeks secara selamat.

Pelajaran 3 daripada 413 langkah

Menggabungkan Kunci Diketahui dan Dinamik ialah pelajaran TypeScript Academy percuma di CoddyKit. Ini ialah pelajaran 3 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran TypeScript Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus TypeScript Academy merangkumi sejumlah 4 pelajaran.

Tetap dan Flexible

Selalunya objek mempunyai beberapa sifat yang dijamin serta set tambahan yang tidak mempunyai had. TypeScript membolehkan anda mengisytiharkan sifat bernama dan tandatangan indeks dalam jenis yang sama — dengan satu kekangan penting.

Kunci Diketahui Bersama Tandatangan

Di sini length sentiasa wujud, manakala sebarang kunci rentetan lain dipetakan kepada nombor. Sifat bernama dan tandatangan indeks boleh wujud bersama.

interface NumberMap {
  length: number
  [key: string]: number
}
const m: NumberMap = { length: 2, a: 1, b: 1 }
console.log(m.length, m.a)

Kekangan Keserasian

Syaratnya: jenis setiap sifat tetap mesti boleh ditetapkan kepada jenis nilai tandatangan indeks. Tandatangan indeks ialah janji tentang semua kunci, jadi setiap kunci bernama mesti mematuhinya.

interface Valid {
  id: number       // ok: number matches the signature
  [key: string]: number
}
const v: Valid = { id: 1, score: 99 }
console.log(v.id + v.score)

Apabila Kekangan Dilanggar

Jika jenis sifat tetap tidak sepadan dengan jenis nilai indeks, TypeScript menolaknya. Sifat bernama rentetan tidak boleh berada dalam kamus yang nilainya berupa nombor.

// interface Broken {
//   name: string   // Error: string not assignable to number
//   [key: string]: number
// }

Meluaskan Jenis Nilai Indeks

Untuk membenarkan jenis sifat tetap yang bercampur, luaskan tandatangan indeks kepada kesatuan yang merangkumi kesemuanya. Kini nama rentetan dan skor berangka kedua-duanya sesuai.

interface Record {
  name: string
  [key: string]: string | number
}
const r: Record = { name: "ana", score: 10 }
console.log(r.name, r.score)

Sifat Tetap Pilihan

Sifat tetap boleh dijadikan pilihan dengan ?. Sifat tersebut masih mesti serasi dengan tandatangan indeks apabila wujud.

interface Config {
  id: string
  label?: string
  [key: string]: string | undefined
}
const c: Config = { id: "x" }
console.log(c.label) // undefined

Sebab Sifat Pilihan Memerlukan undefined

Oleh sebab sifat pilihan mungkin tiada, jenis berkesannya merangkumi undefined. Oleh itu, tandatangan indeks juga mesti membenarkan undefined, atau TypeScript akan mengadu tentang ahli pilihan tersebut.

interface Safe {
  title?: string
  [key: string]: string | undefined
}
const s: Safe = {}
for (const k in s) console.log(s[k])

Jenis Nilai Berbeza melalui Kesatuan

Contoh objek tetapan yang realistik: tanda Boolean yang diketahui, rentetan yang diketahui, dan nilai tambahan sewenang-wenangnya. Kesatuan dalam tandatangan merangkumi jenis setiap sifat tetap.

interface Settings {
  enabled: boolean
  theme: string
  [key: string]: boolean | string
}
const s: Settings = { enabled: true, theme: "dark", lang: "en" }
console.log(s.enabled, s.lang)

Indeks Nombor dengan Kunci Diketahui

Kekangan ini juga terpakai pada tandatangan indeks nombor. Sifat berangka yang bernama mesti sepadan dengan jenis nilai indeks nombor.

interface Sparse {
  count: number
  [index: number]: number
}
const sp: Sparse = { count: 1, 0: 100, 1: 200 }
console.log(sp.count, sp[0])

Alternatif yang Lebih Kemas

Apabila kunci tetap dan kunci dinamik benar-benar mempunyai jenis yang tidak berkaitan, pertimbangkan untuk memisahkannya: letakkan bahagian dinamik di bawah sifatnya sendiri. Ini mengelakkan anda memaksa penggunaan kesatuan yang janggal.

interface Better {
  name: string
  scores: { [key: string]: number }
}
const b: Better = { name: "ana", scores: { math: 90 } }
console.log(b.name, b.scores.math)

Bila Perlu Menggabungkannya

Gabungkan kunci yang diketahui dan dinamik apabila sifat tetap secara semula jadi berkongsi jenis nilai dengan tambahan — contohnya pembilang dengan total, atau tetapan satu jenis dengan beberapa tanda yang dijamin. Jika tidak, penyusunan dalam sifat berasingan mengekalkan jenis yang tepat.

interface Tally {
  total: number
  [bucket: string]: number
}
const t: Tally = { total: 0, a: 3, b: 5 }
t.total = t.a + t.b
console.log(t.total) // 8

Semakan Pantas

Uji pemahaman anda tentang pencampuran kunci tetap dan dinamik.

Ringkasan

Anda boleh mengisytiharkan sifat tetap dan tandatangan indeks bersama-sama, tetapi jenis setiap sifat tetap mesti boleh ditetapkan kepada jenis nilai tandatangan indeks. Luaskan tandatangan dengan kesatuan untuk menampung jenis sifat tetap yang berbeza, dan sertakan undefined apabila sifat tetap adalah pilihan. Apabila jenis benar-benar tidak berkaitan, letakkan bahagian dinamik di bawah kuncinya sendiri.

Percuma untuk bermula

Pelajari TypeScript dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus
101
Pelajaran
352

Soalan Lazim

Adakah pelajaran “Menggabungkan Kunci Diketahui dan Dinamik” percuma?

Ya — teks penuh “Menggabungkan Kunci Diketahui dan Dinamik” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus TypeScript Academy, tingkat taraf kepada CoddyKit PRO. Kursus TypeScript Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Menggabungkan Kunci Diketahui dan Dinamik”?

Campurkan sifat tetap dengan tandatangan indeks secara selamat. Anda berlatih TypeScript Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan TypeScript Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran TypeScript Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 3 daripada 4.

Berapa lamakah pelajaran “Menggabungkan Kunci Diketahui dan Dinamik” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

  1. Menentukan Tandatangan Indeks
  2. Tandatangan Indeks Rentetan berbanding Nombor
  3. Menggabungkan Kunci Diketahui dan Dinamik
  4. Tandatangan Indeks berbanding Record
← Kembali ke TypeScript Academy