Иногда мы заранее не знаем точные имена свойств объекта, но знаем типы его ключей и значений. Для таких случаев в TypeScript используются Index Signatures (сигнатуры индекса).
Синтаксис выглядит так: [key: type]: type. Это позволяет описывать объекты, работающие как словари или справочники.
Пример:
interface StringArray {
[index: number]: string;
}
// Описывает массив или объект, где ключи - числа, а значения - строки
Важно помнить, что если у интерфейса есть Index Signature, то все явно указанные свойства должны соответствовать этому типу. Этот урок поможет вам типизировать динамические объекты.
- Модуль 1: Введение в TypeScript
- Модуль 2: Примитивные типы
- Модуль 3: Специальные типы
- Модуль 4: Массивы
- Модуль 5: Кортежи (Tuples)
- Модуль 6: Объекты
- Модуль 7: Функции
- Модуль 8: Union типы
- Модуль 9: Литеральные типы
- Модуль 10: Type Aliases
- Модуль 11: Интерфейсы
- Модуль 12: Type Guards и Narrowing
- Модуль 13: Enums
- Модуль 14: Классы
- Модуль 15: Generics — основы
- Модуль 16: Generics — ограничения
- Модуль 17: Utility Types — базовые
- Модуль 18: Utility Types — работа с Union
- Модуль 19: Utility Types — функции
- Модуль 20: Type Assertions
- Модуль 21: Keyof и Typeof операторы
- Модуль 22: Mapped Types
- Модуль 23: Conditional Types
- Модуль 24: Discriminated Unions
- Модуль 25: Модули и типы
- Модуль 26: Declaration Files
- Модуль 27: Типизация асинхронного кода
- Модуль 28: Практические паттерны
1. Синтаксис сигнатуры
Дан интерфейс Dictionary, который должен описывать словарь, где ключи — строки, а значения — числа. Заполните пропуски в сигнатуре индекса так, чтобы интерфейс соответствовал описанию. Используйте общепринятое имя параметра для ключа.
interface Dictionary {
[input1S: input2S]: input3S;
}
const myDict: Dictionary = { "score": 100 };2. Доступ к свойству
Проанализируйте код на TypeScript, содержащий объект с индексной сигнатурой. Определите, что будет возвращено при попытке получить значение по ключу 'city'. Обратите внимание на типизацию объекта и возможные значения.
interface UserData {
[key: string]: string | number | undefined;
}
const user: UserData = {
name: "Alex",
age: 28,
email: "alex@example.com"
};
const cityValue = user["city"];
console.log(cityValue);3. Найти сигнатуру
Внимательно изучите представленный интерфейс TypeScript. Ваша задача — найти и выделить строку, которая является сигнатурой индекса (index signature). Сигнатура индекса позволяет интерфейсу иметь динамические свойства с определёнными типами ключей и значений. Не выделяйте обычные поля интерфейса, методы или другие конструкции.
interface UserPreferences {
{{theme: string;~|~t1}}
{{language: string;~|~t2}}
{{notificationsEnabled: boolean;~|~t3}}
{{updateSetting(key: string, value: any): void;~|~t4}}
{{[key: string]: any;~|~t5}}
{{getPreference(key: string): any;~|~t6}}
}4. Несоответствие типа
В данном фрагменте кода TypeScript определён интерфейс с индексной сигнатурой, который требует, чтобы все значения свойств объекта были строками. Однако в объекте, который должен соответствовать этому интерфейсу, одно из свойств задано числом. Найдите и исправьте это значение, чтобы объект соответствовал интерфейсу и код мог быть корректно скомпилирован.
interface StringDictionary { [key: string]: string;} const myDict: StringDictionary = { name: "John", age: 30, city: "New York"};5. Словарь зарплат
Из предложенных строк соберите корректное объявление интерфейса SalaryMap на TypeScript, который использует индексную сигнатуру для отображения имени сотрудника (строка) на его зарплату (число). Игнорируйте лишние строки, которые не относятся к объявлению этого интерфейса. В решении должны быть только строки, необходимые для объявления интерфейса с индексной сигнатурой.
interface SalaryMap { [employeeName: string]: number;}type SalaryRecord = { [name: string]: number };interface Employee { name: string; salary: number;}6. Заполнение словаря
Проанализируйте TypeScript-код сверху и восстановите последовательность логических шагов выполнения программы. Шаги снизу перемешаны — расставьте их в правильном порядке, чтобы отразить, как программа создает объект с индексной сигнатурой, заполняет его в цикле и выводит результат.
interface StringDictionary {
[key: string]: string;
}
const dict: StringDictionary = {};
const keys = ['id', 'name', 'role'];
const values = ['001', 'Alice', 'Admin'];
for (let i = 0; i < keys.length; i++) {
dict[keys[i]] = values[i];
}
console.log(dict);7. Количество ключей
В данном задании представлен фрагмент кода на TypeScript, в котором создаётся объект с индексной сигнатурой и добавляются новые свойства различными способами. Проанализируйте код и определите, сколько свойств (ключей) будет содержаться в объекте после выполнения всех операций. Введите одно целое число в поле ответа.
interface DynamicObject {
[key: string]: number;
}
const obj: DynamicObject = { x: 10, y: 20 };
obj.z = 30;
obj['value'] = 40;
const dynamicKey = 'id';
obj[dynamicKey] = 50;
obj['x'] = 15; // Перезапись существующего ключа
console.log(Object.keys(obj).length);