ES2019 realtoughcandy es10

JavaScript ES2019 (ES10) is here (video)

In today’s video I’m giving you a little preview of ES10, also called ES2019.

While this new spec isn’t nearly as earth shattering as, say, ES6, there are still a few interesting new additions we can look forward to using.

ES2019 realtoughcandy es10

One of the most eagerly discussed features in ES2019 is Array.prototype.{flat,flatMap}.

As Vali Shah freeCodeCamp succinctly explains:

Array.prototype.flat() proposed to flatten arrays recursively up to the specified depth and returns a new array.

SyntaxArray.prototype.flat(depth) 
depth — Default value 1, Use Infinity to flatten all nested arrays.

const numbers = [1, 2, [3, 4, [5, 6]]];

// Considers default depth of 1
numbers.flat();
>
[1, 2, 3, 4, [5, 6]]

// With depth of 2
numbers.flat(2);
>
[1, 2, 3, 4, 5, 6]

// Executes two flat operations
numbers.flat().flat();
> [1, 2, 3, 4, 5, 6]

// Flattens recursively until the array contains no nested arrays
numbers.flat(Infinity)
> [1, 2, 3, 4, 5, 6]

Array.prototype.flatMap() maps each element using a mapping function and flattens the result into a new array. It’s identical to the map operation followed by a flat of depth 1.

Syntax: Array.prototype.flatMap(callback) 
callback: function that produces an element of the new Array.

const numbers = [1, 2, 3];
numbers.map(x => [x * 2]);
> [[2], [4], [6]]

numbers.flatMap(x => [x * 2]);
> [2, 4, 6]

This is something many developers are, no doubt, going to find themselves using in various web development settings, whether personal projects or enterprise level situations.

There’s lots more to cover, and we go over some of it in the vid so be sure to check the rest out!

If you’re already rocking some ES2019 let me know in the comments below!

**Also, a special shoutout to my Patrons over at Patreon. Because of your generous support I’m able to create videos that help make you better developers. If you have any suggestions for topics or questions feel free to send me an email or leave a comment here. **

Leave a Comment