JavaScript - Program Flow
JavaScript offers several ways to control the flow of a program. Normally, a JavaScript program will begin to execute a program starting from the first line and continuing with each line to the end of the program. There are several different ways to control the flow of the program, including conditional statements and loops. Each offer the ability for the programmer to evaluate different aspects of the program before continuing down a particular path or repeating a piece of code a specified number of times.
Blocks
An important concept in JavaScript is the block statement, which are used extensively throughout programs. Block statements are used to group statements, expressions, and declarations within logical containers. They are particularly useful in conditional statements, loops, and exception handling statements. A block is created by enclosing the code within an opening and closing curly braces.
{
let firstName = 'bob';
let lastName = 'cobb';
console.log(`${firstName} ${lastName}`);
}
// bob cobb
Conditional Statements
Conditional statements give the programmer the power to specify what code should be executed based on different conditions. Depending on the result of a conditional statement, the program will follow a specified branch and continue to execute the program. For example, a program may display different information for a user depending on information like their age, sex, and location. A program could use this information to conditionally set information.
There are two main ways to handle conditional logic in JavaScript, either with if...else
or switch
statements. The main different is that switch
statements are typically used to match against a set of fixed values whereas if...else
statements can match against one or more boolean values or within ranges of values.
if…else
let age = 34;
if (age <= 18) {
console.log('child options');
} else if (age > 18 && age < 50) {
console.log('adult options');
} else {
console.log('elderly options');
}
// 'adult options'
switch
The switch statement accepts a parameter, against which it will attempt to match as a case. If no match if found, a default option is available to provide some kind of processing in such situations.
let customer = 'vip';
switch (customerType) {
case 'new customer':
console.log('new customer menu');
return;
case 'returning customer':
console.log('returning customer menu');
return;
case 'vip':
console.log('vip menu');
return;
default:
console.log('new customer menu');
return;
}
// 'vip menu'
Loops
Similar to conditional statements, loops provide a way to control the flow of the program. Loops are controlled by setting conditions for how many times a loop should run before exiting. There are several different types of loops including the while
, do...while
, for
, and for...in
loops.
while
A while
loop will execute a block of code while a condition is true and stop the loop when the condition is false.
let counter = 1;
while (counter <= 5) {
console.log(`count number is ${counter}`);
counter += 1;
}
// count number is 1
// count number is 2
// count number is 3
// count number is 4
// count number is 5
do…while
Similar to a while loop, the do...while
loop will execute a code block while a condition is true and stop when the condition is false. The main difference from a while
loops is that a do...while
loop will always run the loop at least once.
let counter = 1;
do {
console.log(`running loop ${counter} times`);
counter += 1;
} while (counter < 3);
// running loop 1 times
// running loop 2 times
for
The for
loop provides a way to control a loop by giving control over an initializing value, a condition under which the loop should continue or finish, and a post-iteration operation - usually to update the initialized value.
for (let i = 0; i < 4; i++) {
console.log(`for loop iteration #${i + 1}`);
}
// for loop iteration #1
// for loop iteration #2
// for loop iteration #3
// for loop iteration #4
for…in
The for...in
loop is available to loop over properties within objects. The properties can either be used as keys for values within the object or as values themselves. For example, in an array, the properties are the index values for each member of the array. And for an object, the properties are the names for the values within the object.
// Array
let numbers = [2, 4, 6, 8, 10];
for (let index in numbers) {
console.log(`number is ${numbers[index]}`);
}
// number is 2
// number is 4
// number is 6
// number is 8
// number is 10
// Object
let employee = {
name: 'Bob Cobb',
age: 35,
manager: true,
};
for (let key in employee) {
console.log(employee[key]);
}
// Bob Cobb
// 35
// true
Conclusion
Being able to control the flow of a program is an essential skill for any programmer. Conditional statements and loops provide key tools to control how a program runs, where it branches, and how many times it will run particular blocks of code. Mastering conditional statements and loops is a foundational skill that is used in most programming languages. Therefore, it’s important that programmers should learn how to construct such statements and how they work.