ES12 / ES2021 Features

As per the ECMAScript® 2022 language specification (ECMA262):

ECMAScript 2021, the 12th edition, introduces the replaceAll method for Strings; Promise.any, a Promise combinator that short-circuits when an input value is fulfilled; AggregateError, a new Error type to represent multiple errors at once; logical assignment operators (??=, &&=, ||=); WeakRef, for referring to a target object without preserving it from garbage collection, and FinalizationRegistry, to manage registration and unregistration of cleanup operations performed when target objects are garbage collected; separators for numeric literals (1_000); and Array.prototype.sort was made more precise, reducing the amount of cases that result in an implementation-defined sort order.

WeakRef and FinalizationRegistry

The WeakRef instances are ordinary objects that inherit properties from the WeakRef prototype.

const personObj = {
  firstName: 'John', 
  lastName: 'Doe',
  getFirstName: function() {
    return this.firstName
  }
}
const personRef = new WeakRef(personObj)
if (personRef.deref()) {
  console.log(personRef.deref().getFirstName())
  console.log(personRef.deref().lastName) 
}

The personObj object should not be garbage collected until the current execution of JavaScript code has completed. The personRef WeakRef should return the personObj Object that is not undefined.

FinalizationRegistry

The FinalizationRegistry is an object that manages registration and unregistration of cleanup operations that are performed when the objects are garbage collected.

Promise.any

The Promise.any function takes an array of promises and returns a promise that is fulfilled by the first given promise to be fulfilled, or rejected. In case, all the given promises are rejected, an AggregateError is thrown holding the rejection reasons.

const firstPromise = new Promise((res) => setTimeout(() => res('first!'), 10))
const secondPromise = new Promise((res, rej) => setTimeout(() => rej('second!'), 20)).catch(e => {})
const resultPromise = Promise.any([firstPromise, secondPromise])
resultPromise.then((v) => console.log(v))

Logical assignment operators (??=, &&=, ||=)

const person = {name: ''}
const firstName = () => "John"
const lastName = () => "Doe"
person.name ||= firstName() // y is assigned to x if x is falsy. Otherwise, x retains its original value.
person.name &&= firstName() // y is assigned to x, if and only if x is a truthy value. Otherwise, it retains its original value.
person.name ??= lastName() // assigns y to x if x is nullish (i.e., either null or undefined).

String.prototype.replaceAll

const test = "Coronavirus testing remains essential. Coronavirus is unlikely to disappear completely."
test.replace("Coronavirus", "COVID19")
test.replaceAll("Coronavirus", "COVID19")

Separator for numeric literals

157_400_000_000.123_456

Resources