Menu
CoddyTech

Обобщенные интерфейсы

Часть раздела Введение в TypeScript путешествия по JavaScript на Coddy. Урок 61 из 73.

Так же, как вы можете создавать обобщённые функции, вы также можете создавать обобщённые интерфейсы. Это позволяет определить структуру объекта, сохраняя при этом типы определённых свойств гибкими и пригодными для повторного использования.

Вот как создать обобщённый интерфейс, используя тот же синтаксис параметров типа:

interface Container<T> {
  value: T;
  isEmpty: boolean;
}

<T> после имени интерфейса создаёт параметр типа, который можно использовать во всём определении интерфейса. В этом примере свойство value будет иметь любой тип, указанный при использовании интерфейса, а isEmpty останется фиксированным типом boolean.

Когда вы используете обобщённый интерфейс, вы указываете конкретный тип в угловых скобках:

const stringContainer: Container<string> = {
  value: "hello",
  isEmpty: false
};
const numberContainer: Container<number> = {
  value: 42,
  isEmpty: false
};
challenge icon

Задание

Легко

Создайте обобщённый интерфейс с именем Result, который может хранить данные любого типа вместе с информацией об успешности.

Интерфейс должен иметь два свойства:

  • success типа boolean
  • data типа T (параметр обобщённого типа)

Создайте следующие объекты, используя свой обобщённый интерфейс:

  • stringResult типа Result<string> со значениями success: true и data: "Operation completed"
  • numberResult типа Result<number> со значениями success: true и data: 42
  • booleanResult типа Result<boolean> со значениями success: false и data: false
  • arrayResult типа Result<string[]> со значениями success: true и data: ["item1", "item2", "item3"]

Создайте обобщённую функцию с именем processResult, которая:

  • Использует параметр обобщённого типа T
  • Принимает один параметр result типа Result<T>
  • Возвращает строковое сообщение
  • Если success равно true, возвращает "Success: [data]"
  • Если success равно false, возвращает "Failed: [data]"

Выведите следующие результаты:

  • Выведите результат вызова processResult с stringResult
  • Выведите результат вызова processResult с numberResult
  • Выведите результат вызова processResult с booleanResult
  • Выведите результат вызова processResult с arrayResult
  • Выведите stringResult.data

Попробуйте сами

// TODO: Напишите ваш код здесь

// Создайте обобщённый интерфейс Result


// Создайте объекты, используя интерфейс Result


// Создайте обобщённую функцию processResult


// Выведите требуемые результаты
quiz iconПроверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.

Все уроки раздела Введение в TypeScript

Потренируйтесь самостоятельно: Песочница TypeScript