TypeScript Academy · Урок

Объединение известных и динамических ключей

Безопасно сочетайте фиксированные свойства с индексными сигнатурами

Урок 3 из 413 шагов

«Объединение известных и динамических ключей» — бесплатный урок TypeScript Academy на CoddyKit. Это урок 3 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения TypeScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс TypeScript Academy содержит 4 уроков всего.

Фиксированные и гибкие свойства

Часто объект содержит несколько гарантированных свойств и открытый набор дополнительных. TypeScript позволяет объявить именованные свойства и сигнатуру индекса в одном типе — с одним важным ограничением.

Известный ключ вместе с сигнатурой

Здесь length присутствует всегда, а любой другой строковый ключ сопоставляется с числом. Именованное свойство и сигнатура индекса сосуществуют.

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

Ограничение совместимости

Есть нюанс: тип каждого фиксированного свойства должен быть совместим с типом значения сигнатуры индекса. Сигнатура индекса — это обещание для всех ключей, поэтому каждый именованный ключ должен ему соответствовать.

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)

Когда ограничение нарушено

Если тип фиксированного свойства не соответствует типу значения индекса, TypeScript отклоняет такое описание. Свойство со строковым именем не может находиться в словаре с числовыми значениями.

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

Расширение типа значения индекса

Чтобы разрешить разные типы фиксированных свойств, расширьте сигнатуру индекса до объединения, охватывающего их все. Теперь и строковое имя, и числовые оценки подходят.

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

Необязательные фиксированные свойства

Фиксированные свойства могут быть необязательными с помощью ?. При наличии они всё равно должны быть совместимы с сигнатурой индекса.

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

Почему необязательному свойству нужен неопределённый тип

Поскольку необязательное свойство может отсутствовать, его фактический тип включает undefined. Поэтому сигнатура индекса также должна допускать undefined, иначе TypeScript сообщит об ошибке для необязательного элемента.

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

Разные типы значений через объединения

Реалистичный объект настроек: известный логический флаг, известная строка и произвольные дополнительные значения. Объединение в сигнатуре охватывает тип каждого фиксированного свойства.

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)

Числовой индекс с известными ключами

Это ограничение также применяется к числовым сигнатурам индекса. Именованное числовое свойство должно соответствовать типу значения числового индекса.

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

Более аккуратная альтернатива

Когда фиксированные и динамические ключи действительно имеют несвязанные типы, рассмотрите разделение: вложите динамическую часть в отдельное свойство. Это избавляет от необходимости использовать неудобное объединение.

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

Когда их объединять

Объединяйте известные и динамические ключи, когда фиксированные свойства естественным образом имеют тот же тип значений, что и дополнительные, — например, счётчики с total или настройки одного вида с парой гарантированных флагов. В противном случае вложенная структура сохраняет типы корректными.

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

Быстрая проверка

Проверьте, насколько вы поняли сочетание фиксированных и динамических ключей.

Ответь в интерактивном уроке

Итоги

Можно объявить фиксированные свойства и сигнатуру индекса вместе, но тип каждого фиксированного свойства должен быть совместим с типом значения сигнатуры индекса. Расширяйте сигнатуру с помощью объединения, чтобы учесть разные типы фиксированных свойств, и включайте undefined, если фиксированные свойства необязательны. Когда типы действительно не связаны, вместо этого вкладывайте динамическую часть под отдельный ключ.

Можно начать бесплатно

Изучай TypeScript с ИИ-репетитором — бесплатно

Пиши и запускай код прямо в браузере, получай мгновенную помощь от ИИ-репетитора 24/7 и продолжи учиться на сайте или в приложении.

Курсы: 101
Уроки: 352

Начать учиться бесплатно Посмотреть полный курс

Часто задаваемые вопросы

Урок «Объединение известных и динамических ключей» бесплатный?

Да — полный текст урока «Объединение известных и динамических ключей» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс TypeScript Academy, подпишись на CoddyKit PRO. Курс TypeScript Academy содержит 4 уроков всего.

Чему я научусь в уроке «Объединение известных и динамических ключей»?

Безопасно сочетайте фиксированные свойства с индексными сигнатурами Ты практикуешь TypeScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать TypeScript Academy?

Предыдущий опыт не требуется. TypeScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 3 из 4.

Сколько времени занимает урок «Объединение известных и динамических ключей»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке TypeScript Academy?

Да. Каждый урок TypeScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

Определение индексных сигнатур
Индексные сигнатуры строк и чисел
Объединение известных и динамических ключей
Индексные сигнатуры и Record

← Назад к TypeScript Academy