Friday , 17 November 2017
Home / Programming / JavaScript / Manipulating Loops – JavaScript Tutorial
Manipulating Loops
Manipulating Loops

Manipulating Loops – JavaScript Tutorial

This tutorial is part of the JavaScript tutorial series for beginners. To view the whole list of tutorials available and the order in which you should follow them, then click here.

There will be a time where you’ll want to break out of a loop early or skip an iteration. Manipulating loops is possible in JavaScript. It’s actually very easy to do with conditional statements.

Let’s clear our script and update our code to this.

Manipulating Loops

This is the exact example we used in our while loop tutorial. Let’s say we wanted to break out of this loop if i is equal to 5. Let’s update the loop to this.

We added 1 new line of code into our loop. We’re using an if statement to check if i is equal to 5. If this is true, we use the keyword break to break out of this loop.You’ll notice we omit the curly brackets for our if statement. This is because we only have 1 line of code to run. Since it’s not a block, you’re allowed to just add that line of code after the if statement. JavaScript will automatically know to close this statement.

You may be familiar with the break keyword from our switch tutorial. You can this keyword to break out of loops. Something to know is that wherever you break out of loops, any code after it will not run and future iterations for that loop will stop running. So, if you put this in the start of the loop, any code after it will not run. If we were to move this line of code at the end of our loop, then all of our code in the loop will still run.

If you run your script, you should get an alert box with the message 50.

Now, let’s change things up a bit. Let’s say instead of breaking out of the loop, you wanted to skip the current iteration and move onto the next one.

Update your loop  to this.

You’ll notice we switched things up. First, let’s focus on the if statement. Like before, we check if i is equal to 5. If so, we then skip the current iteration. To skip the current iteration, you use the continue keyword.  You’ll notice we increment the value of i before checking the value. This is because if we did it after, this loop will actually run endlessly because it’s always skipping the increment.

If you refresh the page, you should get an alert box with the message 90.

Conclusion

Breaking or skipping iterations in loops can be quite useful. Be careful where you place your break and continue statements as it may cause your loop to run endlessly or you may end up breaking out of the loop earlier than you wanted to.

About Jasko Koyn

Check Also

Try-Catch Statement

Try-catch Statement – Advanced JavaScript Tutorial

The try-catch statement is a unique way to handle errors. When errors occur, usually it …

Leave a Reply

Your email address will not be published. Required fields are marked *

ULTIMATE WORDPRESS DEVELOPMENT COURSE
Want to learn how to create your own custom WordPress plugins and themes? Check out my course!
Get 93% off my course. You'll also learn how to integrate WooCommerce and BuddyPress into your projects. This is a limited time offer
Yes, I would like to get 93% off your course!
No Thanks!
close-link