This content originally appeared on Level Up Coding - Medium and was authored by Tara Prasad Routray
Learn the amazing features offered by the ECMAScript 2021 update.
ECMAScript 2021 (12th edition) is now available, and it ships with new features and syntax improvements. The specifications have been finalized by ECMA International on June 22, 2021. These improvements have been implemented to make JavaScript more robust and to help developers accomplish their tasks easily.
I will demonstrate the top 5 features offered by ECMAScript 2021 in detail so that you can start utilizing them in your projects, and improve your experience in JavaScript. Beginners and experienced developers can benefit from this article.
Top 5 JavaScript Features Offered By ECMAScript 2021 Update
- Numeric Separators
- String.prototype.replaceAll
- Promise.any() and AggregateError
- Logical Assignment Operators
- Private Class Methods and Accessors
1. Numeric Separators
The numeric separators allow you to add underscores between digits in literal numbers, which makes them more readable. These underscores will be stripped out automatically when the files get parsed. Refer to the following code snippet to understand how you can use numeric separators.
2. String.prototype.replaceAll
The replaceAll()function on the String prototype allows replacing all instances of a sub-string, without using regex. If thereplace() is used on a string, it only replaces the first instance of that value. On the other hand, replaceAll() provides the functionality to replace all instances of that value. Refer to the following code snippet to understand how you can use replaceAll().
3. Promise.any() and AggregateError
The Promise.any is the exact opposite of Promise.all(). Promise.any() will be triggered if any of the promises get resolved. On the other hand, the Promise.all() will wait until all promises get resolved. Following are the differences in any(), all(), and allSettled().
- any() — This will execute if at least one promise gets resolved, and will reject if all promises get rejected.
- all() — This will execute if all promises get resolved, and will reject if at least one promise gets rejected.
- allSettled() — This will execute if all promises have either been resolved or rejected.
Refer to the following code snippet to understand how you can use Promise.any().
If all the Promises get rejected, then an AggregateError Exception will be thrown. Refer to the following code snippet to understand how you can handle the exception.
4. Logical Assignment Operators
Three logical assignment operators have been introduced in the ECMAScript 2021 update. These provide a combination of logical operators and assignment expressions.
- Logical OR assignment operator ||=
- Logical AND assignment operator &&=
- Nullish coalescing assignment operator ??=
4.1. Logical OR assignment operator
The logical OR assignment operator ||= accepts two operands and assigns the right operand to the left operand if the left operand is false. Refer to the following code snippet to learn how you can use the logical OR assignment operator.
The logical OR assignment operator short-circuits. This operator ||= is equivalent to the following statement that uses the logical OR operator.
a || (a = b)
4.2. Logical AND assignment operator
The logical AND assignment operator &&= only assigns the right operand to the left operand if the left operand is true. Refer to the following code snippet to learn how you can use the logical AND assignment operator.
The logical AND assignment operator also short-circuits. This operator &&= is equivalent to the following statement that uses the logical AND operator.
a && (a = b)
4.3. Nullish coalescing assignment operator
The nullish coalescing assignment operator ??= only assigns the right operand to the left operand if the left operand is null or undefined. Refer to the following code snippet to learn how you can use the nullish coalescing assignment operator.
The nullish coalescing assignment operator also short-circuits. This operator ??= is equivalent to the following statement that uses the nullish coalescing operator.
a ?? (a = b)
5. 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. These private methods and properties can only be accessed from inside the class. Refer to the following code snippet to learn how you can use the private methods.
The private accessors are — private Getters and Setters. A Getter allows you to fetch the value of a class property, and a Setter allows you to assign a value to a class property. You can define a private getter by using a hash # prefix.
get #newAccountPassword() {}Similarly, you can define a private setter by using a hash # prefix.
set #generateAccountPassword(newPassword) {}Refer to the following code snippet to learn how you can use the private Getters and Setters.
Kudos! You have completed learning the features offered by JavaScript ES12 (ECMAScript 2021) update. Now you can go ahead and start implementing the above features to your current or upcoming projects.
If you enjoyed reading this post and have learnt something new, then please give a clap, share it with your friends, and follow me to get updates for my upcoming posts. You can connect with me on LinkedIn.
Top 5 JavaScript ES12 Features You Should Start Using Now was originally published in Level Up Coding on Medium, where people are continuing the conversation by highlighting and responding to this story.
This content originally appeared on Level Up Coding - Medium and was authored by Tara Prasad Routray
Tara Prasad Routray | Sciencx (2021-11-09T02:36:12+00:00) Top 5 JavaScript ES12 Features You Should Start Using Now. Retrieved from https://www.scien.cx/2021/11/09/top-5-javascript-es12-features-you-should-start-using-now/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.