ECMAScript 2020

[Guest]

ECMAScript 2020


JavaScript Version Numbers
Old JS versions are named by numbers: ES5 (2009) and ES6 (2015).
From 2016, versions are named by year: ECMAScript 2016, 2017, 2018, 2019, ...

New Features in ES2020

BigInt
String matchAll()
The Nullish Coalescing Operator (??)
The Optional Chaining Operator (?.)
Logical AND Assignment Operator (&&=)
Logical OR Assignment (||=)
Nullish Coalescing Assignment (??=)
Promise allSettled():Promise.allSettled([prom1,prom2,prom3]).then {}
Dynamic Import


Warning
These features are relatively new.
Older browsers may need an alternative code (Polyfill)


JavaScript BigInt
JavaScript BigInt variables are used to store big integer values
that are too big to be represented by a a normal JavaScript Number.
JavaScript integers are only accurate up to about 15 digits.

Integer Example

let x = 999999999999999;
let y = 9999999999999999; // too big

Try it Yourself »
BigInt Example

let x = 9999999999999999;
let y = 9999999999999999n;

Try it Yourself »

To create a BigInt, append n to the end of an integer or call
BigInt():

Example

let x = 1234567890123456789012345n;
let y = BigInt(1234567890123456789012345)

Try it Yourself »

The JavaScript typeof a BigInt is "bigint":

Example

let x = BigInt(999999999999999);
let type = typeof x;

Try it Yourself »

BigInt is supported in all modern browsers since September 2020:










Chrome 67
Edge 79
Firefox 68
Safari 14
Opera 54


May 2018
Jan 2020
Jul 2019
Sep 2020
Jun 2018





JavaScript String matchAll()
Before ES2020 there was no string method that could be used to search for all occurrences
of a string in a string.

Example

const iterator = text.matchAll("Cats");

Try it Yourself »

If the parameter is a regular expression, the global flag (g) must be set set, otherwise
a TypeError is thrown.

Example

const iterator = text.matchAll(/Cats/g);

Try it Yourself »

If you want to search case insensitive, the insensitive flag (i) must be set:

Example

const iterator = text.matchAll(/Cats/gi);

Try it Yourself »


Note
ES2021 introduced the string method replaceAll().









The Nullish Coalescing Operator (??)
The ?? operator returns the first argument if it is not nullish
(null or undefined).
Otherwise it returns the second.

Example

let name = null;
let text = "missing";
let result = name ?? text;

Try it Yourself »

The nullish operator is supported in all modern browsers since March 2020:










Chrome 80
Edge 80
Firefox 72
Safari 13.1
Opera 67


Feb 2020
Feb 2020
Jan 2020
Mar 2020
Mar 2020





The Optional Chaining Operator (?.)
The Optional Chaining Operator returns undefined if an object is
undefined or null (instead of throwing an error).

Example

const car = {type:"Fiat", model:"500", color:"white"};
let name = car?.name;

Try it Yourself »

The ?.= operator is supported in all modern browsers since March 2020:










Chrome 80
Edge 80
Firefox 74
Safari 13.1
Opera 67


Feb 2020
Feb 2020
Mar 2020
Mar 2020
Mar 2020





The &&= Operator
The Logical AND Assignment Operator is used between two values.
If the first value is true, the second value is assigned.

Logical AND Assignment Example

let x = 10;
x &&= 5;

Try it Yourself »

The &&= operator is supported in all modern browsers since September 2020:










Chrome 85
Edge 85
Firefox 79
Safari 14
Opera 71


Aug 2020
Aug 2020
Mar 2020
Sep 2020
Sep 2020





The ||= Operator
The Logical OR Assignment Operator is used between two values.
If the first value is false, the second value is assigned.

Logical OR Assignment Example

let x = 10;
x ||= 5;

Try it Yourself »

The ||= operator is supported in all modern browsers since September 2020:










Chrome 85
Edge 85
Firefox 79
Safari 14
Opera 71


Aug 2020
Aug 2020
Mar 2020
Sep 2020
Sep 2020





The ??= Operator
The Nullish Coalescing Assignment Operator is used between two values.
If the first value is undefined or null, the second value is assigned.

Nullish Coalescing Assignment Example

let x;
x ??= 5;

Try it Yourself »

The ??= operator is supported in all modern browsers since September 2020:










Chrome 85
Edge 85
Firefox 79
Safari 14
Opera 71


Aug 2020
Aug 2020
Mar 2020
Sep 2020
Sep 2020
















★
+1

Reference: https://www.w3schools.com/js/js_2020.asp