Iterating Arrays

It’s the last day of the year guys, and I am so excited. 2022 was a year I learned a lot, and that’s some achievement. I am sure I will learn a lot more in 2023, and I will be so glad to share my knowledge in writing with you my friends.

We worked on Array methods and properties in the last article, and I promised we would work on other array methods I consider Higher array methods. That is so because they are best explained and used with data. So today, I will create a small dummy data that we will walk through with these so-called Higher order methods.

I am excited to work on this because it kinda refreshes my knowledge of the topic and also cements what I already know about the topic. So friends, let’s walk through.

We are going to be walking with this set of data.

This is an array with 5 sets of data, and when we log it into the console, it gives the following return:

So now, let’s start iterating this data with our array methods.

1. The map() method.

When we use the map method, it in turn returns a new set of arrays, depending on how the data was modified when it was iterated through. In simple terms, the map method returns a new set of arrays.

I should say this; the array method does about the same thing as the loop, just that it allows you to modify the elements of the data through a callback function (a callback function is a function passed as an argument in another function so that it can be executed in that other function).

Let’s see what the map method does to our data after we modify the return value.

Here, we are only returning the name, age, status and sex values from our new array. We chose not to return the graduated value from the array. Let’s see what it looks like in the console:

The map method can return all the values in the array, the same as a loop would, also it can return only the values of your choice if all the elements in the array are not needed.

2. The filter() method.

The filter method maps through a set of data and returns a shallow set of arrays that passes a set of tests. The test is passed through a callback function. In a simpler explanation, it filters through the original array and returns a new set of arrays that matches the test that was set in the callback function.

Let’s see how the filter method works

From ourNewArray, we set a test that our mappedArray should return only the arrays that have an age of less than 28. So in return, below is our new set of arrays.

The filter method stays true to its name, by returning only the arrays that pass our test.

3. The find() method.

This method works just like the filter method, only that it returns the first array that passes a test. We will use the same set of codes as the filter method and see its return.

The result is shown below:

4. The findIndex() method.

This works just like the find method only that it only returns the index of the first array that passes the test set in the callback function.

We will use the same code as above and see the output.

The index of the first array that passed our test is 2, as shown in the console.

5. The every() method.

Every method returns a Boolean. It checks if all the sets of arrays pass a test.

Using the same code as earlier, we will see how it works.

Here we are checking if all the arrays have an age of less than 28. The answer is of course false.

Now, let’s test if all the arrays have an age > 15.

Your guess is as good as mine.

I hope this tutorial was helpful. Thanks for taking the time to read through, and I only hope you were able to learn something new.

Have a great day guys, it’s going to be a NEW YEAR in a few hours. Let’s start 2023 in high spirits and have a great learning year ahead.