TypeScript 2.4 RC

Version 2.4 of TypeScript, a popular, type superset of JavaScript. It offers improved load times with the addition of a dynamic import expressions capability. A release candidate version is now available via NuGet or via NPM. Explore this article and see what’s new in TypeScript 2.4 RC.

The latest stable version of TypeScript, can be grabbed through NuGet, or use the following command with npm:

npm install -g typescript@rc

Visual Studio 2015 users (who have Update 3) can install TypeScript from here, and Visual Studio 2017 users using Update 2 will be able to get TypeScript by simply installing it from here.

To get it working, user can easily configure Visual Studio Code and Sublime Text plugin to pick up whatever version the user needs.

DYNAMIC IMPORT EXPRESSIONS

Dynamic import expressions is a new feature and part of ECMAScript that allows the users to asynchronously load a module at any arbitrary point in their program.

For instance, imagine a webpage that allows the user to create and edit images. When the user is working on one file, the page will allow the user to download that file immediately; but if he/she is working on multiple images, then the user can save all of them as a .zip file.

User can conditionally import other modules and libraries. For example, here’s an async function that only imports a utility library when it’s needed:

async function getZipFile(name: string, files: File[]): Promise {
const zipUtil = await import(‘./utils/create-zip-file’);
const zipContents = await zipUtil.getContentAsBlob(files);
return new File(zipContents, name);
}

Many bundlers have support for automatically splitting output bundles based on these import expressions, so consider using this new feature with the esnext module target.

STRING ENUMS
TypeScript 2.4 now allows enum members to contain string initializers.
enum Colors {
Red = “RED”,
Green = “GREEN”,
Blue = “BLUE”,
}

The limitation is that string-initialized enums cannot be reverse-mapped to get the original enum member name. In other words, the user cannot write Colors[“RED”] to get the string “Red”. Improved inference for generics

TypeScript 2.4 introduces a few wonderful changes around the way generics are inferred.

RETURN TYPES AS INFERENCE TARGETS:

TypeScript can now make inferences for the return type of a call. This can improve user experience and catch errors.

function arrayMap<T, U>(f: (x: T) => U): (a: T[]) => U[] {
return a => a.map(f);
}
const lengths: (a: string[]) => number[] = arrayMap(s => s.length);
As an example of new errors you might spot as a result:
let x: Promise = new Promise(resolve => {
resolve(10);
// ~~ Error!
});

STRICTER CHECKING FOR GENERIC FUNCTIONS

TypeScript now tries to unify type parameters when comparing two single-signature types. As a result, user gets the stricter checks when relating two generic signatures.

Type A = <T, U>(x: T, y: U) => [T, U];
type B = <S>(x: S, y: S) => [S, S];
function f(a: A, b: B) {
a = b;  // Error
b = a;  // Ok
}

WEAK TYPE DETECTION

TypeScript 2.4 introduces the concept of “weak types”. Any type that contains nothing but a set of all-optional properties is considered to be weak. For example, this Options type is a weak type:

interface Options {
data?: string,
timeout?: number,
maxRetries?: number,}
In TypeScript 2.4, it’s now an error to assign anything to a weak type when there’s no overlap in properties. For example:
function sendMessage(options: Options) {
// …
}
const opts = {
payload: “hello world!”,
retryOnFail: true,
}
// Error!
sendMessage(opts);
// No overlap between the type of ‘opts’ and ‘Options’ itself.
// Maybe we meant to use ‘data’/’maxRetries’ instead of ‘payload’/’retryOnFail’.

User can think of this as TypeScript “toughening up” the weak guarantees of these types to catch the silent bugs.