ES2021: Additions to the script!

Luvdeep Katyal
3 min readDec 25, 2020

With the coming year, we also have new additions to our favourite programming script, expected to be released in the coming June.
So let us begin with these additions,

1. String.prototype.replaceAll():

In our knowledge we already have string.replace() method that replaces some or all matches of a pattern(a string or a regular expression) in a given string and returns a new string. To replace all the corresponding matches we need a ‘g’ modifier in the regular expression that performs a global search.
Now with the replaceAll() method we can just pass in a replacement and get a new string that replaces all matches of a pattern.Note that the original string remains unchanged.
Let us get this through an example:

const str = “We have additions to the javascript now by the coming es2020, es2020 is also known as es12”;
console.log(str.replaceAll(‘es2020’,’es2021’));
//“We have additions to the javascript now by the coming es2021, es2021 is also known as es12”

2. Private Methods and Accessors:

Methods and accessor functions can be accessed only inside a class where they are defined, for this we need to prepend ‘#’ to the method and the accessor name.
Consider the example:

class Main{
//private method
#privateMethod(){
console.log(“This is a private method”)
};
//public method
publicMethod(){
this.#private();
};
// Public Accessor
get publicAccessor(){ return “Public Accessor” };
set publicAccessor(value);

// Private Accessor
get privateAccessor(){ return “Private Accessor” };
set privateAccessor(value);
};
const obj = new Main();
obj.publicMethod(); // “This is a private method”
obj.privateMethod(); //TypeError: obj.private is not a function
console.log(obj.publicAccessor); //“Public Accessor”
console.log(obj.privateAccessor); // undefined

3. Promise.any() along with AggregateError:

Promise.any() gets settled when any one the promise gets resolved and in case all of the promises are rejected Promise.any() throws an error which is an AggregateError, which we can obviously catch to handle it.
Understand by the following:

try{
const p1 = new Promise((resolve, reject) => resolve(“The first promise”) ) ;
const p2 = new Promise((resolve, reject) => resolve(“The second promise”) ) ;
const p3 = new Promise((resolve, reject) => resolve(“The third promise”) ) ;

(async () => {
const promises = await Promise.any([p1, p2, p3]);
console.log(promises);
// [“The first promise”, “The second promise”, “The third promise” ];
})();
}catch(error){
console.error(`Promise rejected, ${error.errors}`);
throw error;
};

/* Let’ s try to reject the promise being passed in Promise.any()*/
try{
const promiseToReject = new Promise((resolve, reject) => reject());
(async () => {
const promises = await Promise.any([promiseToReject]);
console.log(promises);
})();
}catch(error){
console.error(`Promise rejected, ${error.errors}`);
throw error;
};
// expected output: “AggregateError: No Promise in Promise.any was resolved”

4. Logical Assignment Operator:

According to me it is a very efficient feature and also improves the code quality. Logical assignment operator combines the logical operations(&&, ||, ??) and assignment(=). The Nullish coalescing operator(??) was introduced in this year’s ecma script(es2020) and checks if the value is null or undefined.

let a;
const b = a ??= 10;
console.log(“b has the value”, b) // b has the value 10

similarly for logical OR and the AND Assignment operation:
const d = 5;
const e = d ||= 10;
console.log(“e has the value”, e) // e has the value 5

const f = 1;
const g = f &&= 10; // since f is a truthy value g gets assigned to the value of 10;
console.log(“g has the value”, g) // g has the value 10

The above can be illustrated as:
if(f ){
const g = 10;
};

So after reading the above you must be keen on to use these features in your programming, i guess we have to wait until the coming June for that one.

It is very interesting to get to know about the new features and additions in the, so keep on updating your knowledge.

Thanks for the read!

You can also visit my previous article on es11/es2020:
ES2020: Features for a new decade!

--

--