Одной из сильных сторон TypeScript является возможность создавать сложные структуры данных через комбинацию простых. Множественное наследование интерфейсов позволяет одному интерфейсу наследовать свойства и методы сразу от нескольких других.
Используя ключевое слово extends, вы можете перечислить родительские интерфейсы через запятую: interface Manager extends Person, Employee. Результирующий интерфейс будет требовать наличия полей всех перечисленных родителей. Это ключевой прием в объектно-ориентированном проектировании и разработке масштабируемых приложений.
В этом блоке вас ждут практические примеры по объединению интерфейсов. Вы научитесь конструировать составные типы и применять их к объектам, обеспечивая строгую типизацию без дублирования кода.
- Модуль 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 для множественного наследования интерфейсов используется ключевое слово extends, после которого перечисляются родительские интерфейсы через запятую. Дополните фрагмент кода, вставив пропущенные элементы, чтобы интерфейс Employee корректно наследовал интерфейсы Person и Contact. Обратите внимание на синтаксис и порядок перечисления интерфейсов.
interface Person {
name: string;
age: number;
}
interface Contact {
email: string;
phone: string;
}
interface Employee input1S Person input2S Contact {
employeeId: number;
department: string;
}2. Источники свойств
Перед вами список свойств, которые могут использоваться в TypeScript-интерфейсах. Распределите каждое свойство в соответствующую категорию: «Интерфейс Person» (общие характеристики человека) или «Интерфейс Employee» (характеристики сотрудника). Учтите, что Employee расширяет Person, поэтому свойства, общие для любого человека, должны быть в Person, а специфичные для рабочего контекста — в Employee. Всего нужно распределить 8 элементов.
name: string;salary: number;age: number;department: string;email: string;employeeId: number;address: string;jobTitle: string;3. Создание наследника
Из предложенных строк соберите корректное объявление интерфейса SmartPhone на TypeScript, который наследует от интерфейсов Phone и Computer. Интерфейс SmartPhone должен добавлять метод sendSMS. Убедитесь, что используются только необходимые строки, а лишние (не относящиеся к объявлению этих трёх интерфейсов) — исключены. Код должен быть синтаксически корректным и соответствовать теме множественного наследования интерфейсов.
interface Phone { call(number: string): void;}interface Computer { browse(url: string): void;}interface SmartPhone extends Phone, Computer { sendSMS(message: string): void;}class SmartDevice implements Phone, Computer { takePhoto(): void;4. Реализация объединенного интерфейса
В этом задании вам предстоит реализовать объект типа FlyingCar, который наследует два интерфейса: Car и Plane. В коде ниже заполните пропуски (input1, input2, input3) подходящими значениями из выпадающего списка. Учтите, что объект должен соответствовать обоим интерфейсам: иметь свойства brand и wheels от Car, а также wings от Plane. Обратите внимание на типы данных: brand - строка, wheels и wings - числа.
interface Car {
brand: string;
wheels: number;
drive(): void;
}
interface Plane {
model: string;
wings: number;
fly(): void;
}
interface FlyingCar extends Car, Plane {}
const myFlyingCar: FlyingCar = {
brand: input1S,
wheels: input2S,
drive() {
console.log("Driving on the road");
},
model: "FlyingX",
wings: input3S,
fly() {
console.log("Flying in the sky");
}
};5. Пропущенное свойство
В этом фрагменте кода TypeScript интерфейс C расширяет интерфейсы A и B, используя множественное наследование. Класс MyClass реализует интерфейс C, но в нём неправильно объявлено одно из свойств, унаследованных от родительских интерфейсов. Найдите строку с ошибкой и исправьте её, чтобы класс корректно реализовывал все обязательные свойства интерфейса C.
interface A { a: number; }interface B { b: string; }interface C extends A, B { c: boolean; } class MyClass implements C { a = 10; c = true; b: number;}6. Выбор родительских интерфейсов
Внимательно изучите приведённый фрагмент кода на TypeScript, содержащий объявления интерфейсов. Ваша задача — найти и выделить кликом все имена интерфейсов, которые используются как родительские в конструкции `extends`. Обратите внимание, что один и тот же интерфейс может выступать родителем несколько раз в разных местах, и каждое такое использование нужно отметить отдельно. Не отмечайте имена интерфейсов в их собственном объявлении (после ключевого слова `interface`) и не отмечайте дочерние интерфейсы (те, которые расширяют другие).
interface {{Shape~|~t1}} {
color: string;
}
interface {{PenStroke~|~t2}} {
penWidth: number;
}
interface {{Square~|~t3}} extends {{Shape~|~t4}}, {{PenStroke~|~t5}} {
sideLength: number;
}
interface {{Circle~|~t6}} extends {{Shape~|~t7}} {
radius: number;
}
interface {{Drawable~|~t8}} {
draw(): void;
}
interface {{DrawableSquare~|~t9}} extends {{Square~|~t10}}, {{Drawable~|~t11}} {
clear(): void;
}7. Порядок проверки типов
Проанализируйте TypeScript-код сверху и восстановите последовательность логических шагов, которые выполняет компилятор при проверке типов для объекта, реализующего интерфейс с множественным наследованием. Шаги снизу перемешаны — расставьте их в правильном порядке, чтобы отразить процесс от объявления интерфейсов до финальной проверки объекта.
interface Shape {
color: string;
}
interface Border {
borderWidth: number;
}
interface Square extends Shape, Border {
sideLength: number;
}
const mySquare: Square = {
color: 'blue',
borderWidth: 2,
sideLength: 10
};
console.log(mySquare);Border с обязательным свойством borderWidth: numbercolor из интерфейса ShapeSquare, который наследует Shape и Border через extends и добавляет свойство sideLength: numbersideLength из интерфейса SquareShape с обязательным свойством color: stringmySquare с явным указанием типа Square и инициализация всех свойствborderWidth из интерфейса BordermySquare в консоль после успешной проверки типов