ES11 - ECMAScript 2020
globalThis
The global globalThis
property contains the global this
value, which is akin to the global object.
function canMakeHTTPRequest() {
return typeof globalThis.XMLHttpRequest === 'function';
}
console.log(canMakeHTTPRequest());
// expected output (in a browser): true
Promise.allSettled()
The Promise.allSettled()
method returns a promise that resolves after all of the given promises have either fulfilled or rejected, with an array of objects that each describes the outcome of each promise.
const promise1 = Promise.resolve(3);
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 100, 'foo'));
const promises = [promise1, promise2];
Promise.allSettled(promises).
then((results) => results.forEach((result) => console.log(result.status)));
// expected output:
// "fulfilled"
// "rejected"
nullish coalescing operator (??
)
??
)The nullish coalescing operator (??
) is a logical operator that returns its right-hand side operand when its left-hand side operand is null
or undefined
, and otherwise returns its left-hand side operand.
const foo = null ?? 'default string';
console.log(foo);
// expected output: "default string"
const foo2 = "" ?? 'default string';
console.log(foo2);
// expected output: ""
const baz = 0 ?? 42;
console.log(baz);
// expected output: 0
optional chaining operator (?.
)
?.
)The optional chaining operator (?.
) permits reading the value of a property located deep within a chain of connected objects without having to expressly validate that each reference in the chain is valid. The ?.
operator functions similarly to the .
chaining operator, except that instead of causing an error if a reference is nullish (null
or undefined
), the expression short-circuits with a return value of undefined
. When used with function calls, it returns undefined
if the given function does not exist.
Example 1
let customer = {
name: "Carl",
details: {
age: 82,
location: "Paradise Falls" // detailed address is unknown
}
};
let customerCity = customer.details?.address?.city;
// … this also works with optional chaining function call
let customerName = customer.name?.getName?.(); // method does not exist, customerName is undefined
Example 2
let myMap = new Map();
myMap.set("foo", {name: "baz", desc: "inga"});
let nameBar = myMap.get("bar")?.name;
// undefined
BigInt — Arbitrary precision integers
BigInt is the 7th primitive type.
BigInt is an arbitrary-precision integer. What this means is that variables can now represent 2⁵³ numbers. And not just max out at 9007199254740992.
const b = 1n; // append n to create a BigInt
String.prototype.matchAll()
The matchAll()
method returns an iterator of all results matching a string against a regular expression, including capturing groups.
const regexp = /t(e)(st(\d?))/g;
const str = 'test1test2';
const array = [...str.matchAll(regexp)];
console.log(array[0]);
// expected output: Array ["test1", "e", "st1", "1"]
console.log(array[1]);
// expected output: Array ["test2", "e", "st2", "2"]
Dynamic import
Imports can now be assigned to a variable
element.addEventListener('click', async () => {
const module = await import(`./api-scripts/button-click.js`);
module.clickEvent();
});
Last updated
Was this helpful?