Data Structures
Data structures in JavaScript are the backbone of functionality for most of the projects that I have made in my short coding journey. Data structures, objects and arrays contain the information that programs need to access for a multitude of reasons. If we have a lot of information or data, these data structures will be the best way to store that information.
Of course, at some point, we will want to access this information. While it is possible to retrieve each element one by one, this is obviously not a feasible way to build code. Ideally, we would want to build one piece of code that helps us sort through the entire array or object. Luckily, we do! We can build a chunk of code using an iterator, allowing us to repeatedly fire code on the information we need to. In this post, I’ll go over how we can use iterators, and some useful scenarios to employ them.
Methods Used For Iteration
There are many different methods we can use to iterate objects and arrays in JavaScript. Most of these methods will be used on arrays. I won’t go over every single method, but I would like to highlight some important ones that serve to showcase iteration as a whole.
We can separate array iterators into two very broad categories; The first category is what I would call the find or search iterators, and the second category is arrays that alter or return new arrays.
Search Iterators
As the name suggests, search iterators are used to iterate over arrays and return specific values. There are many different methods that belong to this category, that can be used in many different ways. I’ll start with a very basic example to show what I mean. Here is an example of the find() method:
function searchTeams(team){
if ( team===’cowboys’)
return team
}
In this example, we would use the find method like this:
We place our array first, then the find method, and finally we pass the callback function searchTeams as the argument. The find method will go through every element in the array, and run the searchTeams function on it. When it finally finds what is looking for, it returns that team, like this:
The find method is very limited, because it only returns the first matching element it finds, but it is a good example of all search iterators.
Instead of just one element, maybe you want a whole list of matching elements. This too is possible with array iterators, using the filter method:
function searchTeams(team){
if (team.includes(‘s’))
return team
}
Using the same notation, replacing find with filter, like this:
which returns:
as you can see, the filter method returns all the teams that contain the letter ‘s’, packaged in an array. I’m sure that you can imagine many uses this method could have in retrieving data, that is the power of iterators.
Other Iterators
It’s hard for me to come up with a name that incapsulates non-search array iterators, because their uses are vast and unique. The most basic, but still very useful iterator is forEach. It has a somewhat intuitive name, and you might have guessed that for each array element, it calls a function. Lets take a look at an example:
function changeTeams(team){
let result = team.toUpperCase()
console.log(result)
}
teams.forEach(changeTeams)
As you may have already guess, the result is that the console logs the follwing:
METS
MARINERS
So as you can see, the forEach did exactly what is what meant to do. It went to each element in the array, and ran the changeTeams function, making them uppercase.
Conclusion
Array iterators are some of the most important and useful methods. Whether you are searching for elements, want to change an array, return a modified copy of an array, or reduce an array to a single value, there is an iterator that will do it for you. What I’ve shown in this short blog is only one very small glimpse into the power of iterating data structures, and I encourage anyone to explore them as much as possible.
