Indexsignaturer jämfört med Record
Välj mellan indexsignaturer och hjälpverktygstypen Record.
Indexsignaturer jämfört med Record är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 4 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för TypeScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i TypeScript Academy innehåller totalt 4 lektioner.
Två sätt att typa en map
TypeScript erbjuder två vanliga sätt att beskriva en dictionary: en indexsignatur som { [k: string]: V } och den inbyggda hjälptypen Record<K, V>. De överlappar i stor utsträckning, men uttrycks på olika sätt.
Hjälptypen Record
Record<K, V> skapar en objekttyp vars nycklar är K och vars värden är V. Med string som nyckel är den likvärdig med en indexsignatur för string.
type Scores = Record<string, number>
const game: Scores = { alice: 10, bob: 7 }
console.log(game.alice)Likvärdig med en indexsignatur
Dessa två typer beskriver samma form. Record<string, number> och { [key: string]: number } är utbytbara för godtyckliga strängnycklar.
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 med en union av litterala nycklar
Den verkliga styrkan hos Record visar sig med en ändlig union av litterala nycklar. Den skapar ett objekt där varje angiven nyckel är obligatorisk – något som en indexsignatur inte kan uttrycka.
type Role = "admin" | "editor" | "viewer"
type Perms = Record<Role, boolean>
const p: Perms = { admin: true, editor: true, viewer: false }
console.log(p.admin)Saknade nycklar upptäcks
Eftersom varje litteral nyckel är obligatorisk blir det ett kompileringsfel att glömma någon. Det är en stark garanti som indexsignaturer helt enkelt inte kan ge.
type Role = "admin" | "editor" | "viewer"
// const bad: Record<Role, boolean> = { admin: true, editor: true }
// Error: property viewer is missingIndexsignaturer tillåter godtyckliga nycklar
En indexsignatur är däremot öppen. Man kan lägga till nycklar som aldrig har nämnts någonstans, och inget behöver finnas från början.
type Open = { [key: string]: number }
const o: Open = {} // no keys required
o.anything = 1 // any key allowed
console.log(o.anything)Begränsade nyckelmängder: föredra Record
När nycklarna utgör en känd och ändlig mängd är Record med en litteral union tydligare och säkrare. Det dokumenterar exakt vilka nycklar som finns och tvingar fram fullständighet.
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)Öppna nyckelmängder: båda fungerar
När nycklarna är obegränsade och upptäcks vid körning fungerar både Record<string, V> och en indexsignatur. Många team väljer Record för korthetens skull, medan andra väljer signaturen för tydlighetens skull.
type Cache1 = Record<string, string>
type Cache2 = { [url: string]: string }
const c: Cache1 = {}
c["/home"] = "<html>"
console.log(c["/home"])Record är bara en mappad typ
Under huven definieras Record<K, V> som en mappad typ: { [P in K]: V }. Det förklarar varför en litteral union ger obligatoriska nycklar, medan string ger en indexsignatur.
// 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)Namngivna nycklar plus catch-all
En indexsignatur kan kombinera en catch-all med fasta nycklar i samma gränssnitt – praktiskt när båda behövs. Record kan inte på egen hand kombinera obligatoriska namngivna nycklar med en öppen catch-all lika smidigt.
interface Response {
status: number
[header: string]: number | string
}
const r: Response = { status: 200, "x-id": "abc" }
console.log(r.status)Att välja i praktiken
En tumregel: ändliga, kända nycklar → Record<Union, V> för kontroll av fullständighet. Obegränsade nycklar → valfri form. Namngivna nycklar plus en catch-all → indexsignatur i ett gränssnitt.
type Status = "ok" | "error"
type Messages = Record<Status, string>
const msg: Messages = { ok: "done", error: "failed" }
console.log(msg.ok)Snabbtest
Testa era kunskaper om Record och indexsignaturer.
Sammanfattning
Record<string, V> motsvarar en indexsignatur för string, men Record med en litteral nyckelunion gör varje angiven nyckel obligatorisk och upptäcker utelämnade nycklar vid kompilering. Använd Record<Union, V> för ändliga, kända nycklar, valfri form för obegränsade nycklar och en indexsignatur när ni behöver namngivna nycklar plus en catch-all. Under huven är Record den mappade typen { [P in K]: V }.
Lär dig TypeScript med en AI-lärare – gratis
Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.
- Kurser
- 101
- Lektioner
- 352
Vanliga frågor
Är lektionen ”Indexsignaturer jämfört med Record” gratis?
Ja – hela texten till ”Indexsignaturer jämfört med Record” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i TypeScript Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i TypeScript Academy innehåller totalt 4 lektioner.
Vad lär jag mig i ”Indexsignaturer jämfört med Record”?
Välj mellan indexsignaturer och hjälpverktygstypen Record. Ni övar på TypeScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.
Behöver jag någon erfarenhet för att börja lära mig TypeScript Academy?
Du behöver inga förkunskaper. Utbildningen i TypeScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 4 av 4.
Hur lång tid tar lektionen ”Indexsignaturer jämfört med Record”?
De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.
Kan jag skriva och köra kod i den här TypeScript Academy-lektionen?
Ja. Varje TypeScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.
Alla lektioner i den här kursen
- Definiera indexsignaturer
- Sträng- jämfört med numeriska indexsignaturer
- Kombinera kända och dynamiska nycklar
- Indexsignaturer jämfört med Record