ES12 new Features

ES12 is a version issued by the ECMA Association in 2021. Because it is the twelfth version of ECMAScript, it is also called ES12.

The following is the list of the latest javascript features.

1. String.prototype.replaceAll()
2. WeakRefs
3. Logical Assignment Operator
4. Numeric Separators
5. Promise. any
6. Private class methods

String.prototype.replaceAll():

This method addresses a specific lack in String.prototype.replace.

With the String.replaceAll you can easily replace all occurrences of a given string.

Syntax: String.prototype.replaceAll(searchString, replace string)

For example:
const string=" flyer is a good fly"
console.log(string.replaceAll("fly", "butterfly"));

Output: butterfly is a good butterfly

WeakRefs:

WeakRef is the shorthand for Weak References, and its primary use is to hold a weak reference to another object.

That means it does not prevent the garbage collector from collecting the object.

The Weak Reference is useful when we do not want to keep the object in the memory forever.

But why do we need the WeakRef in the first place?

In JavaScript, the object is not collected by the garbage collector as long as a reference to that object exists.

Thus, it keeps the object in the memory, which leaves you with less memory. The WeakRef implementation allows you to avoid that.

You can create a Weak Reference by using the new WeakRef, and you can read a reference by calling the deref() method.

A simple example would be:

const large object = new WeakRef({
name: "CacheMechanism",
type: "Cache",
implementation: "WeakRef"
});

large object.deref();

Logical Assignment Operator:

You might be familiar with logical operations like ??, &&, or || and the assignment operator =. The Logical Assignment Operator introduced in ES2021 combines logical operations like ??, && or || with an assignment operator =.

Let’s see an example:

var a = true var b = false // Old if (!a) {   a = b } // New a ||= b // returns a // Old if (a) {   a = b } // New a &&= b // returns b

Numeric Separators:

This feature literally improves developer experience by enabling developers to make their numeric literals more readable by creating a visual separation between groups of digits.

It’s similar to the way we use commas to separate numbers in writing. For example:

const balance = 9_300_254_812

JavaScript
Using the underscore, deciphering the above number becomes a no-brainer, in contrast to not using the underscore as shown below.

const balance = 9300354812

Promise. any:

Promise. any() takes an iterable of Promise objects.

It returns a single promise that resolves as soon as any of the promises in the iterable fulfills, with the value of the fulfilled promise.

If no promises in the iterable fulfill (if all of the given promises are rejected), then the returned promise is rejected with an AggregateError, a new subclass of Error that groups together individual errors.

Example:

const promise1 = Promise.reject(0); const promise2 = new Promise((resolve) => setTimeout(resolve, 100, 'quick')); const promise3 = new Promise((resolve) => setTimeout(resolve, 500, 'slow')); const promises = [promise1, promise2, promise3]; Promise.any(promises).then((value) => console.log(value));

Private Class Methods and Accessors:

The class methods and properties are public by default, but the private methods and properties can be created

by using a hash # prefix. The privacy encapsulation has been enforced from the ECMAScript 2021 update.