Skipping items and ending loops with vanilla JavaScript
So far this week we’ve learned about the for
loop and the for...in
loop.
Today, we’ll look at how to skip items in a loop, and how to end the loop early.
Skipping items in a JavaScript loop
Inside a for
or for...in
loop, continue
will end the current iteration and skip to the next one.
For example, if we had a list of sandwiches, and wanted to log them all to the console except for turkey
, we would do this.
var sandwiches = [
'tuna',
'ham',
'turkey',
'pb&j'
];
for (var i = 0; i < sandwiches.length; i++) {
// Skip turkey
if (sandwiches[i] === 'turkey') continue;
// Otherwise, log to the console
console.log(sandwiches[i]);
}
// Returns "tuna", "ham", "pb&j"
Ending a JavaScript loop early
Use break
inside a for
or for...in
loop to end it early.
For example, if we want to end our loop once we get to the turkey
sandwich, we would do this.
var sandwiches = [
'tuna',
'ham',
'turkey',
'pb&j'
];
for (var i = 0; i < sandwiches.length; i++) {
// Skip turkey
if (sandwiches[i] === 'turkey') break;
// Otherwise, log to the console
console.log(sandwiches[i]);
}
// Returns "tuna", "ham"
Tomorrow, we’ll look at some handy ES6 methods that make looping through arrays, NodeLists, and objects a lot easier.