Combinare chiavi note e dinamiche
Combini in sicurezza proprietà fisse e index signature.
Combinare chiavi note e dinamiche è una lezione TypeScript Academy gratuita su CoddyKit. Questa è la lezione 3 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento TypeScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso TypeScript Academy include 4 lezioni in totale.
Proprietà fisse e flessibilità
Spesso un oggetto ha alcune proprietà garantite oltre a un insieme aperto di proprietà aggiuntive. TypeScript consente di dichiarare proprietà con nome e una index signature nello stesso tipo, con un vincolo importante.
Una chiave nota accanto a una index signature
Qui length è sempre presente, mentre qualsiasi altra chiave stringa corrisponde a un numero. La proprietà con nome e la index signature coesistono.
interface NumberMap {
length: number
[key: string]: number
}
const m: NumberMap = { length: 2, a: 1, b: 1 }
console.log(m.length, m.a)Il vincolo di compatibilità
Il punto importante è che il tipo di ogni proprietà fissa deve essere assegnabile al tipo del valore della signature. La index signature è una promessa relativa a tutte le chiavi, quindi ogni chiave con nome deve rispettarla.
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)Quando il vincolo viene violato
Se il tipo di una proprietà fissa non corrisponde al tipo del valore dell'indice, TypeScript la rifiuta. Una proprietà con nome stringa non può appartenere a un dizionario di valori numerici.
// interface Broken {
// name: string // Error: string not assignable to number
// [key: string]: number
// }Ampliare il tipo del valore dell'indice
Per consentire tipi diversi nelle proprietà fisse, ampli la index signature a una union che li includa tutti. In questo modo sono compatibili sia un nome stringa sia punteggi numerici.
interface Record {
name: string
[key: string]: string | number
}
const r: Record = { name: "ana", score: 10 }
console.log(r.name, r.score)Proprietà fisse facoltative
Le proprietà fisse possono essere facoltative usando ?. Quando sono presenti, devono comunque essere compatibili con la index signature.
interface Config {
id: string
label?: string
[key: string]: string | undefined
}
const c: Config = { id: "x" }
console.log(c.label) // undefinedPerché le proprietà facoltative richiedono undefined
Poiché una proprietà facoltativa può mancare, il suo tipo effettivo include undefined. Di conseguenza, anche la index signature deve consentire undefined, altrimenti TypeScript segnala un errore relativo al membro facoltativo.
interface Safe {
title?: string
[key: string]: string | undefined
}
const s: Safe = {}
for (const k in s) console.log(s[k])Tipi di valore diversi tramite union
Un oggetto delle impostazioni realistico: un flag booleano noto, una stringa nota e valori aggiuntivi arbitrari. La union della signature comprende tutti i tipi delle proprietà fisse.
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)Indice number con chiavi note
Il vincolo si applica anche alle index signature number. Una proprietà numerica con nome deve corrispondere al tipo del valore dell'indice number.
interface Sparse {
count: number
[index: number]: number
}
const sp: Sparse = { count: 1, 0: 100, 1: 200 }
console.log(sp.count, sp[0])Un'alternativa più pulita
Quando le chiavi fisse e quelle dinamiche hanno tipi realmente non correlati, consideri di separarle: annidi la parte dinamica in una proprietà dedicata. In questo modo evita di imporre una union poco naturale.
interface Better {
name: string
scores: { [key: string]: number }
}
const b: Better = { name: "ana", scores: { math: 90 } }
console.log(b.name, b.scores.math)Quando combinarle
Combini chiavi note e dinamiche quando le proprietà fisse condividono naturalmente il tipo di valore degli elementi aggiuntivi, ad esempio contatori con un total o impostazioni dello stesso tipo con un paio di flag garantiti. In caso contrario, l'annidamento mantiene i tipi coerenti.
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) // 8Verifica rapida
Verifichi la comprensione della combinazione di chiavi fisse e dinamiche.
Riepilogo
È possibile dichiarare insieme proprietà fisse e una index signature, ma il tipo di ogni proprietà fissa deve essere assegnabile al tipo del valore della signature. Ampli la signature con una union per accogliere tipi diversi nelle proprietà fisse e includa undefined quando queste sono facoltative. Quando i tipi sono realmente non correlati, annidi invece la parte dinamica sotto una chiave dedicata.
Domande Frequenti
La lezione «Combinare chiavi note e dinamiche» è gratuita?
Sì — il testo completo di «Combinare chiavi note e dinamiche» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso TypeScript Academy, passa a CoddyKit PRO. Il corso TypeScript Academy include 4 lezioni in totale.
Cosa imparerò in «Combinare chiavi note e dinamiche»?
Combini in sicurezza proprietà fisse e index signature. Eserciti TypeScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare TypeScript Academy?
Non è richiesta alcuna esperienza precedente. TypeScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 3 di 4.
Quanto tempo richiede la lezione «Combinare chiavi note e dinamiche»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione TypeScript Academy?
Sì. Ogni lezione TypeScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Definire le index signature
- Index signature stringa e numerica a confronto
- Combinare chiavi note e dinamiche
- Index signature e Record a confronto