4 Major Problems with JavaScript ForEach
Why you Need to Be Careful
The JavaScript forEach Loop is a common way to execute a function on each element of an array.
However, we must address 4 Major Problems with the forEach loop before using it.
In this article, we explore each problem in the context of a creative example.
So without further ado… Let’s dive right in!
1. Inability to Break or Continue
Before we begin, let's take a look at this JavaScript program:
Our scenario is simple:
- We have an array of
soldiers
- For each
soldier
, we promote them by appending "Captain" to the start.
But what if we don't want to promote "Daniel" to captain?
You may be tempted to use the continue
keyword to skip the relevant iteration:
However, this doesn't work, and you will get a syntax error.
The flow of a forEach loop is uninterruptible, therefore the only way to solve this problem is by using a conditional statement:
2. Asynchronous Execution
Since soldier promotion is synchronous, the order of promotion will happen in ascending order, from John to Adam.
Now lets say you have an asynchronous function instead.
The forEach loop will not wait for the completion of async functions, which could lead to unexpected output orders.
Let's simulate an async function by setting a random delay for each iteration:
Here are the outputs after running the program twice:
3. Inability to Modify the Array
This is a sneaky one because you are actually allowed to change the elements in the array, however this is generally considered bad practice.
It is bad practice because the forEach loop is not designed for this purpose, and can therefore result in overprocessing data and/or skipping elements.
Here is an example of me removing the first soldier "John" during the forEach loop:
Now the output may confuse you as "John" is deleted, which also leads to "Daniel" being skipped.
This is because after using the splice()
function, the array is shifted to the left, which puts "Daniel" in index 0, and is therefore skipped.
4. Lack of Error Handling
The lack of error handling is perhaps the biggest problem.
Unlike other array functions like map()
or filter()
, forEach doesn't have any built-in error handling.
In other words, if an error occurs inside a forEach, the error propagates up to the nearest try-catch
block.
And if this doesn't exist, the program crashes.
And since the error occurs in a higher scope, it is difficult to find the exact error location, which will lead to a long debugging session.
Conclusion
Today we reviewed 4 key problems with the forEach loop.
We visualized each problem using the example of soldier promotion.
If you are using forEach loops, be cautious, since unexpected errors that are difficult to debug can arise.
If you enjoyed this article, please make sure to Subscribe, Clap, Comment and Connect with me today! 🌐