String- und Number-Index-Signaturen
Verstehen Sie die Regeln und Besonderheiten numerischer Schlüssel.
String- und Number-Index-Signaturen ist eine kostenlose TypeScript Academy-Lektion auf CoddyKit. Dies ist Lektion 2 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des TypeScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der TypeScript Academy-Kurs umfasst insgesamt 4 Lektionen.
Zwei Arten von Indexschlüsseln
TypeScript unterstützt sowohl string- als auch number-Index-Signaturen. Sie sehen ähnlich aus, verhalten sich aber unterschiedlich, weil JavaScript Objektschlüssel tatsächlich auf eine bestimmte Weise speichert.
Eine number-Index-Signatur
Eine number-Index-Signatur wie { [i: number]: T } beschreibt Objekte, auf die über numerische Positionen zugegriffen wird – vor allem Arrays und arrayähnliche Strukturen.
type NumberList = { [index: number]: string }
const names: NumberList = { 0: "ana", 1: "leo" }
console.log(names[0]) // anaJS wandelt numerische Schlüssel in Strings um
Das ist der entscheidende Punkt: Objektschlüssel in JavaScript sind immer Strings. Wenn Sie obj[0] schreiben, speichert die Engine den Schlüssel tatsächlich als String "0". TypeScript bildet dieses Verhalten ab.
const obj: Record<string, string> = {}
obj[1] = "one"
console.log(obj["1"]) // one — same key!
console.log(Object.keys(obj)) // ["1"]Die Kompatibilitätsregel
Da ein numerischer Schlüssel intern eigentlich ein String ist, erzwingt TypeScript folgende Regel: Wenn ein Objekt sowohl eine number- als auch eine string-Index-Signatur besitzt, muss der Werttyp des number-Index der Werttyp des string-Index zugewiesen werden können.
interface Mixed {
[key: string]: string
[index: number]: string // must match the string value type
}
const m: Mixed = { 0: "a", name: "b" }
console.log(m[0], m.name)Warum diese Regel existiert
Wenn obj[0] und obj["0"] auf denselben Speicherplatz zugreifen, kann der Werttyp nicht an der einen Stelle number und an der anderen String sein. Daher muss der Wert des number-Index ein Subtyp des Werts des string-Index sein, damit die Typen konsistent bleiben.
// This is an ERROR:
// interface Bad {
// [key: string]: string
// [index: number]: number // number not assignable to string
// }Number-indizierte Arrays
Arrays sind der typische Anwendungsfall für number-Indizierung. Der eingebaute Typ Array<T> besitzt im Wesentlichen eine number-Index-Signatur. Deshalb liefert arr[i] einen Wert vom Typ T zurück.
const nums: number[] = [10, 20, 30]
const first: number = nums[0]
console.log(first + nums[2]) // 40Auch Tupel sind number-indiziert
Tupel bauen auf der number-Indizierung auf, legen aber für bestimmte Positionen bestimmte Typen fest. Ein numerischer Zugriff außerhalb des gültigen Bereichs ergibt wieder die Union der Elementtypen oder wird als Fehler markiert.
const pair: [string, number] = ["age", 30]
const label: string = pair[0]
const value: number = pair[1]
console.log(label + ": " + value)String-Index erlaubt beide Zugriffsarten
Ein Objekt mit einer string-Index-Signatur akzeptiert auch Zugriffe mit numerisch aussehenden Schlüsseln, weil die Zahl zunächst in einen String-Schlüssel umgewandelt wird.
type Bag = { [key: string]: number }
const b: Bag = {}
b[5] = 100 // stored as key "5"
console.log(b["5"]) // 100Number-Index akzeptiert keine Strings
Umgekehrt gilt das nicht. Ein Objekt, das nur mit einer number-Index-Signatur typisiert ist, weist String-Schlüssel bereits zur Compile-Zeit zurück, obwohl JavaScript sie technisch zulassen würde.
type OnlyNumbers = { [i: number]: string }
const o: OnlyNumbers = { 0: "x" }
// o.name = "y" // Error: property name not on number-indexed type
console.log(o[0])Die passende Variante wählen
Verwenden Sie einen number-Index für sequenzartige, positionsbasierte Daten wie Listen und Tupel. Verwenden Sie einen string-Index für benannte Zugriffe wie Dictionaries und Caches. Im Zweifel ist string die allgemeinere Wahl.
type Positions = { [i: number]: { x: number; y: number } }
type ByName = { [name: string]: { x: number; y: number } }
const p: Positions = { 0: { x: 1, y: 2 } }
console.log(p[0].x)Praktisches Objekt mit gemischten Indizes
Sie können beide Signaturen kombinieren, wenn ein Werttyp für beide geeignet ist – etwa bei sparsamen, arrayähnlichen Containern, die zusätzlich benannte Slots bereitstellen.
interface Flexible {
[key: string]: number
[index: number]: number
}
const f: Flexible = { 0: 1, total: 99 }
console.log(f[0] + f.total) // 100Schnelltest
Testen Sie Ihr Verständnis der string- und number-Index-Signaturen.
Zusammenfassung
String- und number-Index-Signaturen unterscheiden sich, weil JS alle Schlüssel als Strings speichert und Zahlen in String-Schlüssel umwandelt. Wenn beide vorhanden sind, muss der Werttyp des number-Index dem Werttyp des string-Index zugewiesen werden können. Die number-Indizierung bildet Arrays und Tupel ab, die string-Indizierung Dictionaries. String-indizierte Objekte akzeptieren numerische Zugriffe, number-indizierte Objekte weisen String-Schlüssel dagegen bereits zur Compile-Zeit zurück.
Häufig gestellte Fragen
Ist die Lektion „String- und Number-Index-Signaturen“ kostenlos?
Ja — der vollständige Text von „String- und Number-Index-Signaturen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des TypeScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der TypeScript Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „String- und Number-Index-Signaturen“?
Verstehen Sie die Regeln und Besonderheiten numerischer Schlüssel. Du übst TypeScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um TypeScript Academy zu starten?
Keine Vorkenntnisse erforderlich. TypeScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 2 von 4.
Wie lange dauert die Lektion „String- und Number-Index-Signaturen“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser TypeScript Academy-Lektion Code schreiben und ausführen?
Ja. Jede TypeScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Index-Signaturen definieren
- String- und Number-Index-Signaturen
- Bekannte und dynamische Schlüssel kombinieren
- Index-Signaturen und Record