If you are a JavaScript developer then you might probably know that ECMAScript 2020 just released. Hence, that also brings exciting Features to JavaScript as well. I want to just make you aware of some of the features that may help you a lot in your future projects!
1) Optional Chaining:
const testing = {
key1: "value1"
}
console.log(testing.key2.name); //throws error if the key is not defined
console.log(testing?.key2?.name); //gives undefined if the key is not defined
By looking above example, you might already understand the power of the Optional Chaining. It is just not adding syntactic sugar to the code but also gives you the power to check for the key right away. Before this, we used to use hasOwnProperty() for checking the existence of the key for avoiding errors. This is definitely one of the great features introduced in JavaScript 2020.
2) Promise.allSettled():
const promise1 = Promise.resolve(3);
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 100, 'foo'));
Promise.allSettled([promise1, promise2]).
then((results) => console.log(results));
Output:
Promise.allSettled() is newly introduced method in JavaScript 2020. JavaScript already has one method similar to this that is Promise.all(). But there is a slight difference between the working of both methods.
Promise.all(): If one of the promises fails, then all the rest of the promises fail. Then Promise.all() gets rejected.
Promise.allSettled(): It returns the status of all promises after all, promises fulfilled despite each promise resolved or rejected.
You can make it clear by looking at the above example and its output.
3) Dynamic Import:
async function doSomething(){
const lib = await import('heavylib');
//do something with *lib*
}
doSomething();
Dynamic import allows us to load external libraries/modules when we need. Before, we used to load libraries/modules at the top despite the fact that all modules are not required right away. Some required to have later in the program.
The main benefit of this method is we can reduce the website loading time. And that's what most of the website owners want to have. It can be a useful tool when performance is the main goal in your project.
4) Nullish Coalescing Operator:
let num = 0;
console.log(num || 10); //10
console.log(num ?? 10); // 0
console.log(null ?? 10); // 10
It is one of my favorite features introduced in JavaScript 2020. It helps when we want to validate data existence.
Suppose, I want to check if the particular variable has no value then I want to assign it pre-defined value. We can achieve the same thing by Logical OR operator but there is one problem that it considered zero as a falsy value whereas zero can be a valid value. Actually, that's the problem solved by this new operator. It considers only null and undefined as falsy value whereas zero considers as a valid value.
Here ends, I want to let you know that that's not all. I have highlighted the features that I think will help you in future projects!
I hope you liked it and let me know your thought on this topic by commenting down below.
Follow me on twitter: https://twitter.com/ykhokhaneshiya
Top comments (2)
No. 3 is already widely used.
Yeah. That is true.