days
-4
-4
hours
-1
0
minutes
-5
-8
seconds
0
-3
search
No breaking changes here!

TypeScript 3.3: Better behavior for calling union types

Jane Elizabeth
TypeScript
© Shutterstock / Oleg Krugliak

TypeScript 3.3 is here! What can we expect from this stable superset of JavaScript? Better behavior for calling union types, faster build times for composite projects, JavaScript editing in your favorite IDEs, and absolutely no breaking changes!

In the past year, TypeScript has continued to gain fans and rise high on various charts. Why wouldn’t it? After all, this language is one of the sturdiest supersets for JavaScript, providing a stable foundation for Angular. Now, TypeScript 3.3 is here!

This update is smaller than the average upgrade, but there is a silver lining: absolutely no breaking changes! Version 3.3 makes it easier and safer to upgrade from older versions of TypeScript.

Let’s explore what’s in the latest update!

Better behavior for calling union types

Occasionally, TypeScript will have a union type A | B. The latest version of TypeScript makes it possible for developers to access the intersection of members, i.e. all the properties common to both A and B. This means that you can get a property from a union type only if it’s present in every union type. This works best when every type only has one signature with identical parameters. You can just call these types and everything works out.

However, this can be kind of restrictive and runs the risk of too many errors. As a result, TypeScript 3.3 makes it easier to call for union types.

type Fruit = "apple" | "orange";
type Color = "red" | "orange";

type FruitEater = (fruit: Fruit) => number;     // eats and ranks the fruit
type ColorConsumer = (color: Color) => string;  // consumes and describes the colors

declare let f: FruitEater | ColorConsumer;

f("orange"); // It works! Returns a 'number | string'.

f("apple");  // error - Argument of type '"apple"' is not assignable to parameter of type '"orange"'.

f("red");    // error - Argument of type '"red"' is not assignable to parameter of type '"orange"'. 

In this version, the parameters of these signatures are intersected and create a brand new signature. As the example above shows, the parameters for fruit and color are intersected to create a new parameter of type Fruit & Color. Impossible intersections evaporate.

However, some restrictions may still apply. This calling behavior is only used when one type in the union has multiple overloads and a generic signature. Additionally, adding an explicit type annotation will work.

SEE ALSO: TypeScript’s meteoric rise on the charts

Incremental file watching for composite projects

Back in the 3.0 release, composite projects became a thing. Essentially, developers could break up a large project into smaller, easily built components that could preserve project structure and maintain the TypeScript developing experience. Now, developers can use --build mode to recompile on the set of projects and dependencies, optimizing inter-project builds.

Along the same lines, the --watch mode builds re-checks and re-emits change files or files with dependencies that might impact type-checking, optimizing intra-project builds. However, building composite projects with --build --watch didn’t use the composite infrastructure.

Now, in version 3.3, --build mode’s --watch flag does leverage incremental file watching for considerably faster builds. In fact, this has led to a 50%-75% reduction of build times.

Other updates

TypeScript relies on contributions from developers like you! We can definitely see this in the new TypeScript plugin for Sumblime Text, which was developed by Zhengbo Li and community contributor @idiotWu. This plugin supports editing in JavaScript files! Users can take advantage more accurate completions, rename, go-to-definition, and more in JavaScript code that utilizes JSDoc and interoperates with TypeScript code.

SEE ALSO: Meet Kalimdor — A machine learning library written in TypeScript

Getting TypeScript 3.3

Want to try out the new TypeScript? Get it through NuGet or through npm with the following command:

npm install -g typescript 

The TypeScript project recently announced its 6-month roadmap for the first half of 2019. Keep track of upcoming features in TypeScript 3.4 here.

As always, contributions, criticisms, and bug reports are always welcome.

Author
Jane Elizabeth
Jane Elizabeth is an assistant editor for JAXenter.com.

Leave a Reply

Be the First to Comment!

avatar
400
  Subscribe  
Notify of