TypeScript: Псевдонимы типов (Type Aliases)
Представим программу, в которой есть объект пользователя. Этот объект используется повсеместно. В такой ситуации описание типа этого объекта будет повторяться в каждом определении функции:
function doSomething(user: { firstName: string, lastName: number }) {}
function doSomethingElse(user: { firstName: string, lastName: number }) {}
function doSomethingAnother(user: { firstName: string, lastName: number }) {}
Во-первых, здесь много дублирования. Во-вторых, значительно усложняется изменение структуры, так как придется руками править все места, где встречается это определение. В этом уроке разберем, как избежать таких проблем.
Задаем псевдоним типа
Чтобы не делать одну и ту же работу, TypeScript позволяет задавать псевдоним для составных типов. Так мы не будем повторяться:
type User = {
firstName: string;
pointsCount: number;
}
Теперь можно провести замену во всех функциях:
function doSomething(user: User) {
// ...
}
Псевдоним — это не создание нового типа данных. Это способ сокращенно записать определение типа. Поэтому следующие примеры будут работать без проблем:
const user = {
firstName: 'Mike',
pointsCount: 1000,
};
// Оба вызова работают
doSomething(user);
doSomething({ firstName: 'Bob', pointsCount: 1800 });
При этом разработчики на TypeScript говорят «создал тип», а не «создал псевдоним типа». Поэтому в этом курсе мы будем придерживаться общепринятого формата.
Типы можно задавать для любых типов данных, например, для простых:
type SomeType = string;
А также для составных:
// union тип из трех возможных значений
type SomeType = string | number | null;
// Функция
type Countable = (coll: number[]) => number
Объекты и функции
Описание типа функции вне объекта и внутри отличается. Когда функция записывается самостоятельно, используется формат стрелочной функции:
type Countable = (coll: number[]) => number
Внутри типа, который описывает объект, формат меняется на используемый для обычных свойств:
type User = {
firstName: string;
pointsCount: number;
count(coll: number[]): number;
}
Но это не касается колбеков, которые могут быть использованы внутри:
type User = {
firstName: string;
pointsCount: number;
// Типы взяты для примера
count(coll: (v: string) => string): number;
}
В этом уроке мы научились использовать псевдонимы типов. Также мы узнали, как задавать псевдоним для составных типов.
Задание
Реализуйте функцию getOlderUser()
, которая принимает на вход двух пользователей и возвращает того, который старше. Если пользователи являются ровесниками, то возвращается null
:
const user1 = { name: 'Petr', age: 8 };
Определите для пользователя псевдоним, чтобы не дублировать определение его типа в параметрах функции.
Упражнение не проходит проверку — что делать? 😶
Если вы зашли в тупик, то самое время задать вопрос в «Обсуждениях». Как правильно задать вопрос:
- Обязательно приложите вывод тестов, без него практически невозможно понять что не так, даже если вы покажете свой код. Программисты плохо исполняют код в голове, но по полученной ошибке почти всегда понятно, куда смотреть.
В моей среде код работает, а здесь нет 🤨
Тесты устроены таким образом, что они проверяют решение разными способами и на разных данных. Часто решение работает с одними входными данными, но не работает с другими. Чтобы разобраться с этим моментом, изучите вкладку «Тесты» и внимательно посмотрите на вывод ошибок, в котором есть подсказки.
Мой код отличается от решения учителя 🤔
Это нормально 🙆, в программировании одну задачу можно выполнить множеством способов. Если ваш код прошел проверку, то он соответствует условиям задачи.
В редких случаях бывает, что решение подогнано под тесты, но это видно сразу.
Прочитал урок — ничего не понятно 🙄
Создавать обучающие материалы, понятные для всех без исключения, довольно сложно. Мы очень стараемся, но всегда есть что улучшать. Если вы встретили материал, который вам непонятен, опишите проблему в «Обсуждениях». Идеально, если вы сформулируете непонятные моменты в виде вопросов. Обычно нам нужно несколько дней для внесения правок.
Кстати, вы тоже можете участвовать в улучшении курсов: внизу есть ссылка на исходный код уроков, который можно править прямо из браузера.