New Features in ECMAScript 2021 Update
Last Updated :
02 Mar, 2023
ECMAScript is a part of JavaScript language which is mostly used in web technology, building websites, or web apps. ECMAScript is growing as one of the world’s most widely used general-purpose programming languages. It is majorly used in embedding with web browsers and is also adopted for server and embedded applications.
New updates to ECMAScript will release this July. The new improvements are introduced to make JavaScript more powerful and also make working easy for developers. It provides new functions, simple ways to do complex work, and much more.
New updates: The new JavaScript features in ECMAScript 2021 are as follows.
1. Logical assignment Operators: Logical assignment operators introduce new operators which combine logical operators and assignment expressions.
And & Equals (&&=): It assigns when the value is truthy.
Previous version:
let x = 1;
if(x){
a = 10;
}
Output:
x = 10
New version:
let x = 1;
x &&= 10;
Output:
x = 10
OR & Equals (||=): It assigns when the value is falsy. The assignment operation happens only if x is a falsy value. If x contains 1 which is a truthy value, an assignment does not happen. Here x contains 0 therefore assignment happens.
Previous version:
Javascript
let x = 0;
x = x || 10;
console.log(x);
|
Output:
x = 10
New version:
Javascript
let x = 0;
x ||= 10;
console.log(x);
|
Output:
x = 10
Nullish coalescing & Equals (??=): Symbol ?? is a nullish coalescing operator in JavaScript. It checks if a value is null or undefined.
Javascript
let x;
let y = 10;
x ??= y;
console.log(x);
console.log(y);
|
Output: The value of x is undefined, therefore the right-hand side expression is evaluated and sets x to 10.
10
10
2. Numeric Separators: To improve readability and to separate groups of digits, numeric literals use underscores as separators. It also can be used for Binary, Hex, and Octal bases.
Javascript
const money = 1_000_000_000;
console.log(money);
|
Output:
1000000000
3. JavaScript String replaceAll() Method: If we want to replace all instances of a substring in string then this new method replaceAll() is very useful.
Javascript
const s = "You are reading JavaScript 2021 new updates.";
console.log(s.replaceAll("JavaScript", "ECMAScript"));
|
Output:
You are reading ECMAScript 2021 new updates.
4. Promise.any() Method: It returns a promise that will resolve as soon as one of the promises is resolved. It is the opposite of the Promise.all() method which waits for all promises to resolve before it resolves. What will happen when all the promises are rejected, The method will throw an AggregateError exception with the rejection reason. We have written the code inside a try-catch block.
Javascript
const promiseOne = new Promise((resolve, reject) => {
setTimeout(() => reject(), 1000);
});
const promiseTwo = new Promise((resolve, reject) => {
setTimeout(() => reject(), 2000);
});
const promiseThree = new Promise((resolve, reject) => {
setTimeout(() => reject(), 3000);
});
try {
const first = Promise.any([
promiseOne, promiseTwo, promiseThree
]);
} catch (error) {
console.log(error);
}
|
Output:
Uncaught (in promise) AggregateError: All promises were rejected
5. Private class methods: Private methods have scope inside the class only, so outside the class, they are not accessible.
Previous version:
Javascript
class GfG {
showMe() {
console.log("I am a geek")
}
#notShowMe() {
console.log("Hidden informations")
}
}
const gfg = new GfG()
gfg.showMe()
gfg.notShowMe()
|
Output:
Explanation: The error is shown as follows. This is because notShowMe() is now a private method inside the class GfG and can only be accessed via a public method inside the class
New version:
Javascript
class GfG {
showMe() {
console.log("I am a geek");
}
#notShowMe() {
console.log("Hidden informations");
}
showAll() {
this.showMe()
this.#notShowMe();
}
}
const gfg = new GfG();
gfg.showAll();
|
Output:
I am a geek
Hidden informations
Explanation: We create a new public method called showAll() inside the class GfG. From this public method, we can access the private method #notShowMe() and since our new method is public we get the following result.
6. Private Getters and Setters: Just like privatemethods, now we can make getters and setters so that they can only be accessed inside a class or by instance created.
Javascript
class GfG {
get #Name() {
return "GeeksforGeeks"
}
get viewName() {
return this.#Name
}
}
let name = new GfG();
console.log(name.viewName);
|
Output:
GeeksforGeeks
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...