What’s new in TypeScript 4.2 beta version and features

The TypeScript 4.2 Beta is out!

Atit
Atit
Jan 13 · 3 min read

In case you’re new to TypeScript, it’s a language that expands on JavaScript by adding linguistic structure for type revelations and explanations.

Image for post
Image for post

In this article, we will briefly discuss a few features that have been released with TypeScript 4.2 beta version.

To install TypeScript latest version,

npm install typescript@beta

1. Rest Elements supports at other positions in Tuple Types

In previous versions of TypeScript, we were not able to write reset element anywhere in tuple Type with some restrictions.

Image for post
Image for post

4.2 onwards we can write

let test1: [...string[], number];

test1= ["hello!", "hello!", "hello!", 123];

let test2: [boolean, ...string[], boolean];

test2 = [true, "some", "hello", "text", false];

2. Type Alias becomes smarter

In the previous version when we create a method with the primitive types and hover over the functions we were no able to see the type declared which is changed in the newer version.

Image for post
Image for post

4.2 onwards

BasicPrimitive | undefined

3. Template Literal Expressions Have Template Literal Types

In older versions of TypeScriptthere was a bit of a strange inconsistency between template string types and template string expressions.

Image for post
Image for post

In TypeScript 4.2, template string expressions now always start out with template literal types. Similarly to string literal types, these types disappear and turn into string through a process called widening if we assign one of these values to a mutable variable.

// Has the type `${string}there`const test1 = `${str}there`;//worksconst test2: `${string}there` = test1;

4. Stricter Checks for the in Operator

In JavaScript, it is a runtime error to use a non-object type on the right side of the in operator. TypeScript 4.2 ensures this can be caught at design-time.

var b1: number;var rb1 = 'x' in b1;

5. --noPropertyAccessFromIndexSignature

TypeScript made it possible to use “dotted” property access syntax like user.name when a type had a string index signature.

function values(val: Options) {
// valid
for (const excludePattern of val.excludes) {
// ...
}
}

6. noImplicitAny Errors Apply to Loose yield Expressions

When a yield an expression is captured but isn’t contextually typed, it will now throw an error.

function* g1() {
const value = yield 1; // report implicit any error
}
function* g2() {
yield 1; // result is unused, no error
}
function* g3() {
const value: string = yield 1; // result is contextually typed by type annotation of `value`, no error.
}
function* g3(): Generator<number, void, string> {
const value = yield 1; // result is contextually typed by return-type annotation of `g3`, no error.
}

7. Type Arguments in JavaScript Parsing Changes

We need to be cautious while writing the type arguments in JavaScript as it will parse differently for example:

f<T>(20)

TypeScript will parse it as the following JavaScript:

(f < T) > (20)

This may impact you if we were using TypeScript’s API to parse type constructs in JavaScript files.

8. Declare Helper Function

The TypeScript was not supporting a quick fix for declarations before which will be supported with the newer versions.

Image for post
Image for post

9. TypeScript’s lift Callback in visitNode Uses a Different Type

TypeScript has a visitNode a function that takes a lift function. lift now expects a readonly Node[] instead of a NodeArray<Node>.To know more about this change you can check out here.

References:

https://devblogs.microsoft.com/typescript/announcing-typescript-4-2-beta/

JavaScript In Plain English

New JavaScript + Web Development articles every day.

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store