Введение в интерфейсы
Часть раздела Введение в TypeScript путешествия по JavaScript на Coddy. Урок 39 из 73.
interfaces служат той же фундаментальной цели, что и псевдонимы типов для объектов, но используют другой синтаксис и предлагают некоторые уникальные возможности.
Объявление interface выполняется с помощью ключевого слова interface, за которым следуют имя interface и структура объекта в фигурных скобках:
interface Animal {
name: string;
sound: string;
}
let dog: Animal = {
name: "Buddy",
sound: "Woof"
};Синтаксис чистый и понятный — нужно просто перечислить свойства и их типы внутри тела interface. После определения вы можете использовать имя interface как аннотацию типа в любом месте кода, так же как и псевдонимы типов.
Задание
ЛегкоСоздайте интерфейс с именем Pet со следующими свойствами:
nameтипаstringspeciesтипаstringageтипаnumberisVaccinatedтипаboolean
Создайте интерфейс с именем Vehicle со следующими свойствами:
makeтипаstringmodelтипаstringyearтипаnumber
Используя свои интерфейсы, создайте следующие переменные:
- Создайте переменную с именем
myDogтипаPetсо значениями name"Buddy", species"Golden Retriever", age3и isVaccinatedtrue - Создайте переменную с именем
myCatтипаPetсо значениями name"Whiskers", species"Persian", age2и isVaccinatedfalse - Создайте переменную с именем
myCarтипаVehicleсо значениями make"Toyota", model"Camry"и year2022
Создайте функцию с именем describePet, которая принимает параметр типа Pet и возвращает значение типа string в формате "[name] is a [age]-year-old [species]".
Создайте функцию с именем getVehicleInfo, которая принимает параметр типа Vehicle и возвращает значение типа string в формате "[year] [make] [model]".
Выведите следующие результаты в отдельных строках:
- Вызовите
describePetс аргументомmyDogи выведите результат - Вызовите
describePetс аргументомmyCatи выведите результат - Вызовите
getVehicleInfoс аргументомmyCarи выведите результат - Выведите статус вакцинации
myDog(свойствоisVaccinated)
Попробуйте сами
// TODO: Напишите ваш код здесь
// Создайте интерфейс Pet
// Создайте интерфейс Vehicle
// Создайте переменные, используя ваши интерфейсы
// Создайте функцию describePet
// Создайте функцию getVehicleInfo
// Выведите требуемые результатыВ этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.
Все уроки раздела Введение в TypeScript
1Начало работы с TS
Что такое TypeScript?Зачем использовать TypeScript?Ваш первый код на TypeScriptПроцесс компиляции и ошибкиИтоги: Введение в TS4Работа с функциями
Типизация параметров и возвращаемых значенийТипизация стрелочных функцийТип возвращаемого значения 'void'Необязательные параметры с '?'Значения параметров по умолчаниюТипизация Rest-параметровОпределение типов функцийИтоги: Создание типизированных функций2Основные типы
Базовые типы: str, num, booleanТип 'any': лазейкаТип 'unknown'Работа с 'null' и 'undef'Вывод типов в действииЯвные аннотации типовИтоги: Практика по основным типам5Типы: псевдонимы, объединения и пересечения
Псевдонимы типов для примитивовТипы объединения ('|')Работа с типами объединенияЛитеральные типыТипы пересечения ('&')Комбинирование псевдонимов типовИтоги: продвинутые комбинации типов3Структуры данных: массивы и кортежи
Типизированные массивыМодификатор 'readonly' для массивовЧто такое кортеж?Объявление кортежей и доступ к нимДеструктуризация кортежейКортежи readonlyМногомерные типизированные массивыОператор spread с массивамиИтоги: массивы и кортежиПотренируйтесь самостоятельно: Онлайн-компилятор JavaScript