Что такое литералы шаблонов
Начиная с Typescript 4.1, вы можете значительно улучшить набор текста для ваших строк. Напомним, что в Typescript вы можете определять так называемые «литеральные типы». Вместо того, чтобы просто определять переменную как строку, вы можете сузить тип до определенного набора разрешенных строк.
// Define a mutable string as 'Literal Type'.
let key: "name" | "department" = "name";
// This works, as 'department' is part of the type.
key = "department";
// Won't work, as it's not define in the union type.
key = "company";
// Of course, the same applies for functions.
function getKey(): "name" | "department" {
return Math.random() <= 0.5 ? "name" : "department";
}
Начиная с Typescript 4.1, эта концепция получила дальнейшее развитие. Взяв за основу «Template Literal Strings» из Javascript в качестве вдохновения, вы можете применить тот же синтаксис к своим типам литералов в Typescript. Основное отличие состоит в том, что с «типами шаблонных литералов» вы получаете гораздо большую гибкость, поскольку сам тип может принимать параметры для этой формы - концепция аналогична универсальным, но немного отличается тем, что требует определенных значений.
// Define a Literal Type
type State = "ready";
// Nice, isn't it? As in Javascript's
// 'template literal strings', we can
// reuse the same syntax for TS.
//
// The create type here is now 'Key-ready'.
type Key = `key-${State}`;
// This of course works for union types as well.
// Let's take these non-descriptive types for a
// quick demo:
type GraphState = "sleep" | "ready" | "error";
type MachineState = "booting" | "running";
// And here's the 'template literal type':
type EntityState = `ES-${GraphState | MachineState}`;
// The possible combinations therefore
// work out like this:
//
// type EntityState = 'ES-sleep'
// | 'ES-ready'
// | 'ES-error'
// | 'ES-booting'
// | 'ES-running'
В Typescript 4.3 есть еще больше
На момент написания этой статьи был выпущен релиз-кандидат для Typescript 4.3, который включает дальнейшие улучшения для типов литералов шаблонов.
Система типов теперь еще более динамична и может лучше определять правильные типы для вас. Эти последние изменения сделали более зрелым тип строки шаблона.
// This example is taken 1:1 from
// Typescript's 4.3 announcement.
// Please check out the link in the
// addendum to see all examples!
declare let s: string;
declare function f<T extends string>(x: T): T;
// Previously: string
// Now : `hello-${string}`
let x2 = f(`hello ${s}`);
Заключение
Как вы видели, Typescript - очень мощный язык, когда дело доходит до определения динамических типов. Это особенно верно для строковых типов. С последними изменениями в версии 4.3 система типов может лучше определять правильные типы, чем когда-либо, что делает работу с Typescript просто удовольствием.