TypeScript 4.1 Adds Template Literal Types

The TypeScript team announced the release of TypeScript 4.1, which includes powerful template literal types, key remapping of mapped types, and recursive conditional types.

Template literal types have a very enthusiastic response from the community. This new feature provides the ability to use normal string literal types as definitions for other types, making it easy to create and enforce your preferred template syntax grammar.

Template string literals can also get generated dynamically and infer from substitution positions within the template string. To further support common use cases in template string literals, TypeScript also adds new utility type aliases for modifying letter casing: Uppercase, Lowercase, Capitalize, and Uncapitalize.

The community has created many interesting template string literals examples, including querySelector, router parameter parsing, expression parsing, JSON parsing and serializing, GraphQL typed AST, SQL query validation, CSS parsing, games, spell checking, and more.

Haskell and PureScript have a similar feature and it is great to see support added to TypeScript.

TypeScript 4.1 also improves mapped types by adding key remapping. Mapped types were previously limited to new object types with their provided keys. Now mapped types support the creation of new keys or the filtering out of existing keys.

Another significant addition to TypeScript 4.1 is recursive conditional types. This addition makes it easier to support features such as the new flat method on arrays or complex promise trees. The change to support this addition is that conditional types can now immediately reference themselves within branches, making it easier to author recursive type aliases. The TypeScript team warns that this pattern should get used sparing to avoid slow recursive type checks, and beyond a support level of recursion depth, the TypeScript compiler will produce a compile-time error.

TypeScript 4.1 adds a new compiler flag, --noUncheckedIndexedAccess, identifying areas of potentially undefined property keys. This new feature is not automatically included with the --strict flag because it changes behavior in some common scenarios, such as iterating over the indexed of traditional for loops.

React 17 users get two new JSX options to better support production and development compilation, react-jsx and react-jsxdev.

With these many improvements in TypeScript 4.1, there are several breaking changes to consider when upgrading:

• The built-in lib.d.ts changes how DOM types get automatically generated, and also removes the Reflect.enumerate API due to its deprecation from ES2016.
• abstract members of classes no longer get marked as async. Callers are only concerned with the return type, so there is no value specifying an abstract member as async.
• The any and unknown types now get propagated in falsy positions.
• resolve‘s parameters now get required in promises. TypeScript 4.1 includes a quick fix to streamline the upgrade.
• Conditional spreads create optional properties.
• Unmatched parameters are no longer related.

Work is already underway for TypeScript 4.2, expected in February 2021. Some of the TypeScript 4.2 release goals include generalized index signatures, leading/middle rest elements in tuple types, --noImplicitOverride, --noPropertyAccessFromIndexSignature, static index signatures, typeof class, faster compile-time iteration, and further editor and productivity improvements.

TypeScript is open source software available under the Apache 2 license. Contributions and feedback are encouraged via the TypeScript GitHub project and should follow the TypeScript contribution guidelines and Microsoft open-source code of conduct.