top of page

Decisions and Loops

Introduction


So before we go into any technical details, what do you understand when you hear the word decision making?

It is very much similar to our daily lives that we encounter a situation where we think to ourselves that okay, what action is required from my side if following is the case and then we proceed accordingly.


In programming languages we use control statements to make decisions, to control the flow of the program based on certain conditions.

Let us take an example, suppose we want to run a certain block of code only if the value of a is equal to 10. In this situation, we can use control statements.


Control Statements



In JavaScript, we have the following control statements


  • If

  • If-else

  • Nested-if



These statements allow us to control the flow of the program execution based upon conditions known only during the run time. Let’s look at each of them in great detail

//add boolean


If statement


It is the most simple decision-making statement. It helps us to decide whether or not to run a certain block of code i.e. if the certain condition is true then the block of statements should be executed otherwise not.



In the example above the condition can either be evaluated to be true or it can be false. So, if the condition evaluated to be the block of code inside the curly braces will be executed and if it doesn’t evaluate to be true the block of code will be skipped and the next statement in the sequence will be executed.

We have a look at the flowchart to have an even better understanding of the same.




In the flow chart above we can visually see what we have been talking about, and what will be the flow of the diagram.

Let us now look at some examples to understand how we can implement the if statement.




A simple example above show that the console statement will be executed only when the value of variable a will be greater than 4.

We can verify the same by having a look at the console below, the output will be “a is greater than 4”.





If-else statement


As we have seen above, how can we conditionally execute a block of code after a certain condition is true but what if we want to execute a block of code after the condition is false?

Then we make use of the else statement.

It is like simply making a decision that if the following condition is true that executes a certain block of code and if it is not true then executes the other block of the code.

Let us look at the syntax of if..else to understand it in a bit more detail




So, I think we now understand how an if-else block functions, but let us further have a look at the flowchart to understand the flow through the program.


Let us now look at some examples to understand how we can implement various functionality through loops.



If we try to extend the previous example and include the else part in the code, then for the given condition of a that is a =3, the else part will be executed.

If we look at the output we can verify that the output is “a is less than 4”.




Nested if statement


After the understanding of if and if..else, I think we can have a look at an interesting phenomenon of nesting the if loop.

So, what exactly do we mean by nesting here?


We know that we can execute a certain block of code after a given condition is true, but in that block of code, we can also check for another condition to be true/false and execute another block of code. Confused?

Let us look at the syntax that will help you grab a better understanding of the concept.




In the example above after condition 1 is true, we execute the block of code but inside that block of code we have checked for another condition named condition2 and if that evaluates to be true then, the code inside the block below it will be executed.


So, basically what we did was to check for multiple conditions to evaluate their respective blocks of code and that too at run-time. Isn’t it awesome?

Let us now look at some examples to understand how we can implement the nested if statement




In the example above what we did is just as an extension of our previous code,

Inside the if statement we added another check, that whether the value of b is greater than 3 or not, and only when both the conditions are true, we will receive output in the console saying - “The value of a is greater than 4 and the value of b is greater than 3”.




We can verify that we received the same output in the console.


Loops


Before understanding what loops are or how we use them, let us get a basic understanding of why we even need loops in the first place.


Let’s start by taking an example, in the code given below we print “Hello world ” to the console.




It is very simple and we understand how it functions, but what if we want to print hello world to the console like 100 times? What are we gonna do now?

Are we expected to write the same code 100 times to achieve the functionality or is there any feature/functionality that can help us?

This is where loops come in.


Whenever we want a certain statement or a block of a code to be repeated a number of times then we make use of Loops.

So, by definition Loops are used to execute a group of instructions or a block of code multiple times without writing them repeatedly.


Loops are supported by all modern programming languages, though their implementations and syntax may differ from one another.

As we have the basic knowledge of loops, let us now have a look at the loops in Javascript and study them in great detail.


But before we proceed further with the tutorial, you need to have a basic understanding of data types so if you have already gone through with the data types part then cheers!!😀😀

And if not kindly complete that portion first before moving further as you will need that knowledge to be applied here.




But a question might come to your mind that if loops can repeat a statement a number of times then how can we as a programmer get control over it? WIll the loop run according to its own wish?

The answer is no!! We have full control over how many times the loop will run, The condition through which we control the same is called a test condition. Using test conditions we check that if a certain condition is true then only we continue with the execution of the loop or else we exit the loop execution cycle.


Types of Loops in JavaScript


Based on the test condition, there are mainly two types of loops in javascript-


  • Entry controlled loops- In this loop, the test condition is tested before entering the loop body,

  • Exit controlled loops- In this type of loop, the test condition is tested or evaluated at the end of the loop body.


Okay so, you might not be able to understand everything that we just discussed but it is fine, as it contained a lot of technical terms and we are gonna discuss each one of them in great detail later so, you will have a firm grip over them by the end of this section



For loop


It is the most important and most commonly used loop in javascript.

So, let us first understand the structure of the for a loop. To run a loop we initialize a variable, then we set a constraint on that variable and finally we increment it to make the loop work.

In the example below, we initialize a variable ‘a’ with a value 5, then we created a constraint(Test condition) to control the number of times the loop will be executed i.e. a<=10 which implies that the loop will run until the value of a is less than 10 and finally, we have the increment condition, through which we increment the value of a.











Let us look at some code to a much better understanding and clarity