angular.forEach VS for
Why ?
If you ask yourself which one is the best, this battle is for you.
First of all, check out forEach.
Make sure to understand why I recommand to use angular.forEach
instead of myArray.forEach
.
Note: this battle is only in case of arrays, use forEach for objects !
Reminder:
angular.forEach(elements, function(element, key) {
// ...
}, context);
for (var i = 0, length = 10; i < length; i++) {
// ...
}
forEach: advantages
You can loop through arrays and objects.
for loop is only for arrays.
You can access easily to the key
and value
.
The code syntax is more appropriate to read it.
for: advantages
The for loop is the fastest way to loop through an array.
Far better than forEach.
You can break
it to increase the speed.
Moreover, you can add alias to break a specific layer in case of multiple nested loops.
If the loop is in a function with a return statement, you can use return
to stop the loop and return directly the data.
It’s the equivalent to use break
then return
.
Note: the forEach can’t do such a thing because the return is in the anonymous function context.
You can use at your advantage the reverse loop (from end to start, usually when you need to remove elements and continue the loop).
Conclusion
When you work with arrays, you should use the for loop because it’s very fast.
You can increase the speed by using break
and return
when you found what you were looking for.
When you work with objects, use the forEach.
Bonus
You should never recalculate the condition in the for loop.
Bad:
var myArray = [0, 0, 0];
for (var i = 0; i < myArray.length; i++) {
// ...
}
Good:
var myArray = [0, 0, 0];
for (var i = 0, length = myArray.length; i < length; i++) {
// ...
}
Save the current item in a variable to make the for loop more readable.
Example:
var myArray = [0, 0, 0];
var currentElement;
for (var i = 0, length = myArray.length; i < length; i++) {
currentElement = myArray[i];
// ...
}