TypeScript, статически типизированный расширенный набор JavaScript, приобрел огромную популярность в техническом сообществе благодаря своей способности рано обнаруживать ошибки и улучшать читаемость кода. Одной из мощных функций TypeScript является ключевое слово infer, которое позволяет разработчикам писать более выразительные и динамичные типы.

Ключевое слово вывода

Ключевое слово infer, появившееся в TypeScript 2.8, используется в условных типах для создания переменных временного типа. Эти переменные типа затем можно использовать для вывода типов внутри истинной или ложной ветви условного типа. Ключевое слово infer позволяет разработчикам писать более динамичные и выразительные типы, поскольку оно позволяет TypeScript определять конкретный тип на основе контекста, в котором он используется.

Чтобы лучше понять, как работает вывод, давайте взглянем на базовый синтаксис условного типа:

type MyConditionalType = T extends SomeType ? TrueType : FalseType;

В этом примере T — параметр универсального типа, а SomeType представляет тип, с которым сравнивается T. Если T расширяет SomeType, тип MyConditionalType будет TrueType. Если нет, то это будет FalseType.

Теперь давайте добавим ключевое слово infer:

type MyInferredType = T extends SomeType ? U : FalseType;

Здесь мы используем ключевое слово infer для создания переменной временного типа U в истинной ветви условного типа. Если T расширяет SomeType, TypeScript попытается определить тип U на основе типа T.

Примеры

Типвозврата

ReturnType — это служебный тип, который извлекает тип возвращаемого значения функции. Это прекрасный пример того, как ключевое слово infer можно использовать для создания динамических типов. Вот определение ReturnType:

type ReturnType any> = T extends (...args: any[]) => infer R ? R : any;

В этом определении T — это тип функции, который принимает любое количество аргументов и возвращает любой тип. Используя ключевое слово infer, мы создаем переменную временного типа R, представляющую тип возвращаемого значения функции. Если T — функция, TypeScript определяет тип возвращаемого значения и присваивает его R.

Давайте посмотрим ReturnType в действии:

function greet(name: string): string {
  return `Hello, ${name}!`;
}
​
type GreetReturnType = ReturnType; // GreetReturnType is inferred as 'string'

Здесь ReturnType используется для определения типа возвращаемого значения функции приветствия, который является строкой.

Параметры

Другой полезный тип утилиты, использующий ключевое слово infer, — это Параметры. Этот тип извлекает типы параметров функции в виде кортежа. Определение параметров следующее:

type Parameters any> = T extends (...args: infer P) => any ? P : never;

В этом примере мы создаем переменную временного типа P для представления типов параметров функции. Если T — функция, TypeScript выводит типы параметров и присваивает их P как кортеж.

Давайте рассмотрим пример с использованием параметров:

function add(a: number, b: number): number {
  return a   b;
}
​
type AddParameters = Parameters; // AddParameters is inferred as [number, number]

Здесь Параметры используются для определения типов параметров функции добавления, которая представляет собой кортеж [число, число].

Тип обещания

Тип утилиты PromiseType можно использовать для извлечения типа, к которому разрешается обещание. Это особенно полезно при работе с асинхронными функциями. Вот определение PromiseType:

type PromiseType> = T extends Promise ? U : never;

В этом примере мы создаем временную переменную типа U, которая будет представлять тип, к которому разрешается обещание. Если T является обещанием, TypeScript определяет разрешенный тип и присваивает его U. Вот пример:

async function fetchData(): Promise {
  return "Fetched data";
}
​
type FetchedDataType = PromiseType>; // FetchedDataType is inferred as 'string'

В этом случае PromiseType используется для определения типа, к которому разрешается обещание функции fetchData, то есть строки.

Распаковать массив

Тип утилиты UnboxArray можно использовать для извлечения типа элементов массива. Вот определение UnboxArray:

type UnboxArray> = T extends Array ? U : never;

В этом примере мы создаем переменную временного типа U для представления типа элементов массива. Если T — массив, TypeScript определяет тип элемента и присваивает его U. Например:

type MyArray = number[];

type ElementType = UnboxArray; // ElementType is inferred as 'number'

Здесь UnboxArray используется для определения типа элементов внутри типа MyArray, который является числом.

Ограничения

Хотя ключевое слово infer невероятно мощное, оно имеет некоторые ограничения:

1. Можно использовать только внутри условных типов.

2. TypeScript не всегда может определить правильный тип, особенно при работе со сложными или рекурсивными типами. В таких случаях разработчикам может потребоваться предоставить дополнительные аннотации типов или провести рефакторинг их типов, чтобы помочь TypeScript определить правильный тип.

Заключение

Понимая и используя возможности infer, вы сможете создавать более гибкие проекты TypeScript. Начните рассматривать возможность включения ключевого слова infer в свой набор инструментов уже сегодня.

Если вы нашли это полезным, рассмотрите подписку на мою рассылку новостей чтобы получать больше полезных статей и инструментов о веб-разработке. Спасибо за прочтение!