Продвинутый TypeScript — Часть 1

Дженерики

в этом разделе я расскажу об одной важной концепции TypeScript: дженерики позволяют передавать типы в качестве параметра другому блоку (функции, классу, интерфейсу и т. д.).

Пример

type MyFunction<TArgs, TReturn> = (args: TArgs) => TReturn;
const numToString: MyFunction<number, string> = num => num.toString();
//         '---------> take `number` and return `string`

поэтому тип MyFunction теперь берет два дженерика для описания типа args и возвращаемого типа.

вы можете пойти дальше и ввести:

type MyFunction<TArgs extends { a: unknown }, TReturn = TArgs['a']> = (
  args: TArgs,
) => TReturn;
const numToString: MyFunction<{ a: number }> = obj => obj.a;
//         '-------> return `number`

это означает, что разработчик должен использовать аргумент со свойством (a), а тип возвращаемого значения будет того же типа, что и это свойство (a).

еще не интересно?

Тип поиска

это способ машинописного текста заставить его угадывать тип из аргументов без необходимости вводить его самостоятельно.

Пример

const anyToAny = <T>(arg: T) => arg;
// old 🤕
const oldNum = anyToAny<number>(1)
// new 🤩
const num = anyToAny(1)
//     '-------> type of `number`
// new 🤩
const str = anyToAny('pizza')
//     '-------> type of `string`

Понимаете…

машинописный текст угадывает тип параметров без необходимости его передачи!!

начать интересоваться? продолжай 😉

Условные типы

Условный тип означает, что вы зависите от условия, чтобы определить тип.

Пример

type IsString<T> = T extends string ? true : false;
type PowerLvl1 = IsString<string>
//       '------> typeof `true`
type PowerLvl2 = IsString<number> extends true ? 'YES' : 'NO'
//       '------> typeof `'NO'`

вы видите, что машинописный текст угадывает тип в зависимости от условий!

Все эти примеры в github

Я надеюсь, что вы найдете эти примеры очень полезными, увидимся в следующей части.