Best features of ES2020
ES2020 is the 11th version of what has now become one of the most popular programming languages. JavaScript has come a long way in the last few years and I would even go as far as saying I enjoy working with it now (shock horror!). For 2020, we gain a few additional features which, although minor, have the potential to forever change how we solve some problems whilst working with JavaScript.
Optional Chaining
I cannot understate my excitement about this feature! Although minor, it is something that has driven me insane for years. Previously, whilst working with JS, we have had to jump through hoops when dealing with nested objects and checking for potential undefined
values. Consider the following example:
Obtaining the error within the nested object requires manually checking if any of the values are undefined
. We could potentially refactor the above function to look like:
I'm not a fan of this syntax. It looks horrific and it's not the best in terms of readability. (Not to mention writing that many brackets is painful). However, now with ES2020 we can utilise optional chaining 🎉!
The ?.
operator functions like the .
chaining operator, except that instead of throwing an error if a reference is nullish, the expression short-circuits with a return value of undefined
Note that you may also use optional chaining when attempting to call a method which may not exist. (Not that you should make a habit of this)...
Yes, we can also use optional chaining with arrays and objects.
Nullish Coalescing
In JS, the regular way of short-circuiting values (using the ||
or operator) is flawed due to the nature of how it checks if a value is falsey
rather than empty
. I.e. it treats false
, undefined
, 0
and null
the same (even if false
or 0
may be valid options).
ES2020 introduces the ??
operator which only evaluates to the right-hand side when the initial value is null
or undefined
.
Legacy Method (Short-circuiting):
Nullish coalescing method:
Promise.allSettled
I love this one. If you're a big user of Promise.all
you would have, no doubt, occasionally wished that you could tell when all of your promised were resolved or rejected. In the current implementation Promise.all
rejects as soon as one promise is rejected, even while there may still be others pending. This is great in some use cases, however, sometimes you want to know when all the promises have finished working.
allSettled
behaves in such a manner. It only resolves when all of the promises have finished working and become fulfilled or rejected. It is never rejected, only pending
or resolved
. Its return value is a pending Promise that will be asynchronously fulfilled once every promise in the specified collection has completed. For each outcome, a status
string is returned (either fulfilled
or rejected
). If the status is fulfilled
a value
is also returned. If the status is rejected
, a reason
is present instead.
String.matchAll
The function name says it all. It's like match
but extracts all references of a text match. matchAll
returns an iterator. You can iterate over the values with for..of
or you can convert it to an array.
Dynamic Import
Dynamic imports can help reduce bundle size by loading dependencies on demand. The dynamic import
structure returns a promise (which means you can use async/await
.
globalThis
JavaScript is objects. Objects are JavaScript. There's always one big object that contains all the things. In browsers, that object is known as window
. In Node, that object is global
. WebWorkers use self
- you get the picture. Trying to access the wrong object will throw an error in your application. globalThis
abstracts away this issue. You can now refer to the parent object with globalThis
without worrying about which context you're in. (This change is backwards compatible hence the weird name).
BigInt
There is a new type BigInt
that represents a number greater than Number.MAX_SAFE_INTEGER
(2^53 - 1
). Whilst not relevant to my work, BigInt
may be handy to those working in machine learning. To utilise, just add n
to a number.
Note: You cannot mix up numbers and BigInts - you must coerced to either type before performing algebra.