> Как типизировать объект с разными ключами и значениями в TypeScript? (TypeScript)
Уровень: senior · Роль: frontend · Категория: Технические вопросы
Компании: Инрэко, КИТМЕД
Стек: TypeScript
> Пример ответа
В TypeScript для типизации объекта с разными ключами и значениями можно использовать несколько подходов в зависимости от ситуации.
- Индексная сигнатура (Index Signature) - когда ключи имеют один тип, а значения - другой, но все значения однотипны:
TYPESCRIPTinterface StringDictionary {[key: string]: string;}const obj: StringDictionary = { name: "Alice", city: "Moscow" };
- Запись (Record) - удобный встроенный утилитарный тип для однотипных значений:
TYPESCRIPTtype NumberRecord = Record<string, number>;const scores: NumberRecord = { math: 95, physics: 88 };
- Маппинг (Mapped Types) - когда ключи ограничены конкретным набором, а значения могут различаться по типам:
TYPESCRIPTtype StatusMap = {[K in "active" | "inactive"]: K extends "active" ? boolean : string;};// или более гибко:type Config = {[key: string]: string | number | boolean;};
- Дискриминирующие объединения (Discriminated Unions) - для объектов с разными структурами в зависимости от ключа:
TYPESCRIPTtype Shape =| { kind: "circle"; radius: number }| { kind: "square"; sideLength: number };
- Условные типы с
in- для точного контроля:
TYPESCRIPTtype MixedObject<T extends string> = {[K in T]: K extends "id" ? number : string;};type MyObj = MixedObject<"id" | "name">; // { id: number; name: string }
Выбор зависит от задачи: для динамических ключей используйте индексную сигнатуру, для фиксированных - маппинг или Record, для сложной логики - условные типы.
> Похожие задачи по frontend
Какие альтернативы использованию infer в TypeScript для типизации ключей?
Уровень: seniorКатегория: Технические вопросы
Компания: RecruitTech
Стек: TypeScript
Можно ли объединить несколько типов в один тип в TypeScript и как это сделать?
Уровень: seniorКатегория: Технические вопросы
Компания: Инрэко, The Tribe
Стек: TypeScript
Как работают type guards в TypeScript
Уровень: seniorКатегория: Технические вопросы
Компания: Точка, Арго
Стек: TypeScript
Что делает extends в TypeScript и зачем он нужен?
Уровень: seniorКатегория: Технические вопросы
Компания: IT-One, TYMY
Стек: TypeScript
> ГОТОВЫ К СЛЕДУЮЩЕМУ СОБЕСЕДОВАНИЮ?
Запустите тренировочную сессию с ИИ и получите детальную обратную связь, чтобы увереннее проходить реальные интервью