Расширение интерфейсов через ключевое слово extends позволяет создавать новые интерфейсы на основе существующих, наследуя все их свойства. Это основа для построения иерархий типов и переиспользования кода.
interface Animal { name: string; }
interface Dog extends Animal { breed: string; }
Интерфейс Dog содержит и name от Animal, и собственное свойство breed. TypeScript поддерживает множественное расширение:
interface Pet extends Animal, Identifiable { ... }
Практические задания помогут разобраться с наследованием интерфейсов, переопределением свойств и разрешением конфликтов при множественном расширении.
- Модуль 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. Базовое расширение
В этом задании вам предстоит поработать с расширением интерфейсов в TypeScript. В предоставленном фрагменте кода объявлены два интерфейса. Второй интерфейс должен наследовать свойства и методы первого, но ключевое слово для наследования и имя родительского интерфейса пропущены. Ваша задача — дополнить код, вставив пропущенные элементы в отмеченные места, чтобы интерфейс-наследник корректно расширял базовый интерфейс. После правильного заполнения код должен успешно компилироваться, а объект, созданный на основе дочернего интерфейса, должен содержать все необходимые свойства.
interface Person {
name: string;
age: number;
}
interface Employee input1S input2S {
employeeId: number;
department: string;
}
const newEmployee: Employee = {
name: 'Alice',
age: 28,
employeeId: 101,
department: 'Engineering'
};
console.log(newEmployee.name);2. Ошибка в расширении
В данном фрагменте кода TypeScript присутствует ошибка, связанная с расширением интерфейса. Внимательно изучите код и найдите строку, где допущена синтаксическая ошибка при попытке наследования одного интерфейса от другого. Исправьте эту строку, чтобы интерфейс мог корректно расширять базовый интерфейс и код стал валидным.
interface Animal { name: string; age: number;} interface Dog extend Animal { breed: string;}3. Собери цепочку интерфейсов
Из предложенных строк соберите цепочку из трёх интерфейсов TypeScript, где интерфейс Car расширяет Vehicle, а интерфейс ElectricCar расширяет Car. Учтите, что некоторые строки являются лишними и не должны входить в решение. Порядок объявления свойств внутри каждого интерфейса не важен, но сами интерфейсы должны следовать в порядке наследования: сначала базовый, затем расширяющий его, и наконец — расширяющий второй.
interface Vehicle { make: string; model: string;}interface Car extends Vehicle { doors: number;}interface ElectricCar extends Car { batteryCapacity: number;}interface Bicycle { wheels: number;}interface Truck extends Vehicle { cargoCapacity: number;}4. Множественное расширение
В этом задании вам предстоит дополнить код TypeScript, в котором интерфейс расширяет несколько базовых интерфейсов. В коде ниже пропущены имена базовых интерфейсов, которые необходимо выбрать из предоставленного списка. Ваша задача — заполнить пропуски, чтобы интерфейс `User` корректно расширял все необходимые базовые интерфейсы и включал все требуемые свойства. Обратите внимание на логику наследования свойств и типов при множественном расширении интерфейсов.
interface Identifiable {
id: number;
}
interface Named {
name: string;
}
interface Timestamped {
createdAt: Date;
}
interface User extends input1S, input2S, input3S {
email: string;
}5. Какие свойства будут?
Проанализируйте цепочку интерфейсов TypeScript, связанных ключевым словом extends. Определите, какой набор свойств будет содержать итоговый интерфейс Manager, и выберите соответствующий вариант из предложенных списков свойств.
interface Base {
id: number;
}
interface Person extends Base {
name: string;
age: number;
}
interface Employee extends Person {
department: string;
getSalary(): number;
}
interface Manager extends Employee {
teamSize: number;
manage(): void;
}
let director: Manager;6. Базовый и расширенный
В левой колонке приведены описания возможностей интерфейсов TypeScript при использовании ключевого слова extends. В правой колонке приведены примеры объявлений интерфейсов. Сопоставьте каждое описание с соответствующим примером объявления интерфейса. Обратите внимание, что в правой колонке примеры перемешаны, и каждое описание соответствует ровно одному примеру.
interface Developer extends Person, Employee {
skills: string[];
}interface Person {
name: string;
}interface Employee extends Person {
age: number;
}interface Manager extends Employee {
manage(): void;
}interface OptionalPerson extends Person {
name?: string;
}7. Анализ иерархии
Проанализируйте TypeScript-код сверху, который демонстрирует цепочку наследования интерфейсов с помощью ключевого слова `extends`. Восстановите логическую последовательность шагов, описывающих создание иерархии интерфейсов и реализацию объекта. Шаги внизу перемешаны — расставьте их в правильном порядке, чтобы отразить, как определяется базовый интерфейс, как он расширяется, и каким требованиям должен соответствовать итоговый объект.
interface PersonBase {
name: string;
}
interface PersonWithAge extends PersonBase {
age: number;
}
interface PersonWithRole extends PersonWithAge {
role: string;
}
const employee: PersonWithRole = {
name: "Alice",
age: 30,
role: "Developer"
};
console.log(employee);PersonWithRole, который расширяет PersonWithAge и добавляет новое обязательное свойство role типа string.PersonBase с обязательным свойством name типа string.employee инициализирован значениями для всех трёх обязательных свойств: name, age и role.employee с типом PersonWithRole, что означает, что объект должен реализовать все свойства из цепочки наследования.PersonWithAge, который расширяет PersonBase и добавляет новое обязательное свойство age типа number.employee выводится в консоль, демонстрируя итоговую структуру данных.