JavaScript Basics-Loops: Part 5
Loops in JavaScript are a way to repeat the same set of actions a set number of times or until a condition is met. While you can write individual lines of almost identical code this can cause you to waste valuable time and make it harder for other developers to follow your application. When utilizing loops the code block to be executed only has to be written once, but can be utilized multiple times. This aligns with the DRY principle of coding which represents Do Not Repeat Yourself.
Loops repeat themselves until provoked to exit. If they are not provoked by a condition or break statement you can find yourself with an infinite loop. This is a situation any developer would want to avoid as this can cause your web browser to crash attempting to do the impossible. This is why it is important to know the purpose of your loop so a flag can be created when that purpose is served.
There are 3 types of loops that we will be focusing on and the first of those will be the While loop. This control flow statement allows code to be executed given a Boolean condition. In this loop the condition is initially tested and if proven true the code block will run. Once the code block is completed the Boolean condition will be revisited to determine if the condition is still true. If proven true the code block will run once again, but if proven false the interpreter ends the loop. In the case the condition is initially false the code block will never be ran by the interpreter.
The next type of loop would be the Do While loop. In this control flow statement the code block is ran first followed by the interpretation of the Boolean condition. If the Boolean condition is proven true the code block will be ran once again. If proven false the interpreter will end the loop. This differs from the While loop as the code block will always ran at least once regardless of the state of the Boolean condition. This loop is useful in cases such as prompt dialog forms where it is necessary to run the code block at least once.
The last of the loops and the most commonly used would be the For loop. This control flow statement will consist of two parts referred to as the header and the code block body. The header itself is split up into 3 components which are the declaration and initialization of the counter, the Boolean condition, and the after thought which is applied after the loop is completed. Like the while loop the Boolean value is evaluated prior to deciding if the code block should be ran. This will loop until the Boolean condition is no longer proven true.
As stated before there are some situations where a Boolean condition would be difficult to implement. In those situations JavaScript has the break keyword that allows you to exit a loop manually. Once a break statement is reached the loop is terminated immediately and the interpreter transfers control to the next line of code following the terminated loop.
While code may be functioning as desired as web developers we always try to find the most efficient approach. This means that code has to be revisited and analyzed on whether it can be minimized while still retaining functionality. This restructuring of code without changing the external behavior is referred to as refactoring. Even when an application is completed the work is never done. Always make time to revisit projects to see where improvements can be made. Especially now when technology is always evolving and growing.
Additional Resources