Unleash the Power of Your Data: 6 ES6 Array Functions You Need to Know 🚀

New day, new daily article! Yesterday we talked about some custom React hooks, but today it is time to talk about arrays.

Yeah, I know, it might sound boring but trust me, it is not. Today I will show you 6 ES6 methods we can find in arrays that you might not know and that are really useful.

Obviously, you can do the same without these methods, but... hey, this simplifies your life (and it is cool), so why not give them a try?

Well, time to start!

🔍 Map

This is a classic. You have probably used this one, but... I had to talk about it just in case.

The .map() function creates a new array by manipulating every element in the original array and returning a new array with the results.

This is useful for transforming arrays in an easier way to work with or visualize.

As always, here is an example:

By the way, since map builds a new array, calling it without using the returned array is an anti-pattern; use forEach or for...of instead.

🔗 More knowledge

💡 Filter

This is really cool. Instead of "transforming" the items like in the map function, here, we filter the array (as its name says). Basically, it creates a new array with all elements that pass the test implemented by the provider function. So yeah, it filters out any elements in the original array that don't meet a specific condition.

Now, one example:

In that example, we are filtering out the numbers that are not even in the array.

🔗 More knowledge

🔢 Reduce

Now one I really like. The .reduce() function. I*t reduces the array to a single value* by iterating through the array and applying a provided function to each element. This function is often used to sum up, all the elements in an array or to find the max or min value.

In this one, I am just getting the sum of all the numbers in the array. That easy.

🔗 More knowledge

💬 Find

This one is also used a lot. The .find() function returns the first element in the array that satisfies the provided testing function.

It is awesome for searching for a specific element in an array.

In this one, we find the first even number in an array.

🔗 More knowledge

🔃 Every & Some

.every() and .some() are similar to .filter() since they test elements in an array against a provided function.

So, what is the difference? Well, .every() returns true if all the elements in the array pass that test. And as you would expect, .some() returns true if at least one element passes the test.

Let's see an example using .every() to check if all elements in an array are even numbers:

And now, let's check an example of using .some() to check if there is at least one odd number in an array:

🔗 More knowledge about every and some

---

So, that is it! Well, not really. There are more helpful functions there, but I didn't want to create a long post. With this article, I wanted to show you that there are excellent functions that you can always find in the docs. But there are more! For example, you could check the flat function.

But no worries, I have more exciting articles coming soon. I publish one every day, so... make sure to follow if you want these little JS pills every day!

🌎 Let's Connect!

• My Twitter: @thenaubit
• My Substack (here I publish more in-depth articles)