loading...
Cover image for two Game Changing new Features in TypeScript 4.1

two Game Changing new Features in TypeScript 4.1

bias profile image Tobias Nickel Originally published at tnickel.de Updated on ・2 min read

Today after vs-code made an automatic update, I stambled over the announcement for the new features in typescript 4.1.

And it absolutely blew my mind. There was the feature, I have been looking for, for almost four years.

I often read over these feature announcements. But this time,... WOW.

In version 4.0 variardic tuples got added. They have been a huge step, allowing to define functions with variable argument lists.

In version 4.1 (wow) there are two features, that together are absolutely powerful, and I wonder if people understand its significance.

type Color = "red" | "blue";
type Quantity = "one" | "two";

type SeussFish = `${Quantity | Color} fish`;
// same as
//   type SeussFish = "one fish" | "two fish"
//                  | "red fish" | "blue fish";
Enter fullscreen mode Exit fullscreen mode
type Getters<T> = { 
  [K in keyof T as `get${capitalize K}`]: () => T[K]
}; 

interface Person { 
   name: string; 
   age: number; 
   location: string; 
} 

type LazyPerson = Getters<Person>;
Enter fullscreen mode Exit fullscreen mode

There it is, mapping keys and renaming them with a little computation. This is so huge for developers of ORMs. Otherwise, today, some ORM require to basically define a schema twice, once for the data structure in the database and a second time for typescript. With this new feature a single definition can be enough.

Also validation libraries such as Joi, json-schema, superstruct, can get huge profit from this feature.

and then API frameworks, that have schema definition such as hapi, fastify, graphql, grpc can gain much better type intellisence for autocompletion with these new features.

The benefits do not end in node.js backend. Also in client side, redux, react-hooks and other libraries, that generate APIs based on a js based typedefinition or value, will be able to provide awesome typescript user experience, without requiering microsoft to actively support the framework, as it happens with react, angular and vue. (still thank for all the effort making development experiences with these framewors great)

Wow, are you also that excited about these updates? I believe they are game changing and and will improve our development experiences not only with typescript, but in the javascript ecosystem in a whole.

ps: The code samples are directly from the typescript blog, follow a link in this article to find more examples.

Discussion

pic
Editor guide