Scribd
Upload
7 views36 pages

If If Else If Else If Else Ladder Switch

notes

Uploaded by

2k23.mca2313345
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
7 views36 pages

If If Else If Else If Else Ladder Switch

notes

Uploaded by

2k23.mca2313345
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 36

Conditional statements in JavaScript

JavaScript code is executed in a linear fashion from the first line to the last line.

If you want to break sequential execution of code then you can use branching
statements. The Control Statement and looping Statements is known as branching
statements.
❑ JavaScript has the following conditional statements.

• if
• if else
• if else if else ladder
• switch
JavaScript If statement

✔ It evaluates the content only if expression is true.


✔ The signature of JavaScript if statement is given below.

✔ Syntax:
if(expression)
{
//content to be evaluated
}
Flowchart of JavaScript If statement
If example
❑ write a javaScript program to check given number is between
1 to 3 or not.

<script>
var userInput = Number(prompt("Please enter a number", ""));
if (userInput == 1)
{
alert("You number is One");
}
if (userInput == 2)
{
alert("You number is Two");
}
if (userInput == 3)
{
alert("Your number is Three");
}
if (userInput != 1 && userInput != 2 &&userInput != 3)
{
alert("Your number is not between 1 and 3");
}
</script>
Exampl
e
JavaScript if…else statement
✔ It evaluates the content whether condition is true or false.
✔ The syntax of JavaScript if-else statement is given below.

✔ Syntax:
if(expression)
{
//content to be evaluated if condition is true
}
else
{
//content to be evaluated if condition is false
}
Flowchart of JavaScript if…else statement
❑ Let’s see the example of if-else statement in JavaScript tofind out any person is
eligible for vote or not?
<html>
<head>
<title>My Page Title</title>
</head>
<body onLoad ="test()">
<script type="text/javascript">
function test()
{
var a=prompt("Enter a no.");
if(a>18)
{
document.write("<body bgcolor='yellow'>");
document.write("<h1>Welcome To Vote</h1>");
}
else
{
document.write("<body bgcolor='yellow'>");
document.write("<h1>You are not elegible for Vote</h1>");
}
}
</script>
</body>
</html>
❑ Let’s see the example of if-else statement in JavaScript to find out the even or
odd number if entered number is odd then background colour become grey and if
number is even then background colour become yellow
<html>
<head>
<title>My Page Title</title>
</head>
<body onload=“test”> }
<script type="text/javascript"> </script>
function test()
{
var a=prompt("Enter a no."); if(a%2==0)
{
document.write("<body bgcolor='yellow'>");
document.write("<h1>Even Number</h1>");
}
else
{
document.write("<body bgcolor='gray'>");
document.write("<h1>Odd Number</h1>");
}
Switch statement in JavaScript
When should we use switch statement

✔ To improve the readability of a program multiple if else if statements can


be replaced with a switch statement.

✔ The switch statement is an alternative to if/else if conditional construct


(commonly called a “case statement”) and may make the program more
readable when handling multiple options.
❑ Notice that in the following code we have several if else if statements
var userInput = Number(prompt("Please enter a number", ""));
if (userInput == 1)
{
alert("You number is One");} else if (userInput == 2)
{
alert("You number is Two");
}
else if (userInput == 3)
{
alert("Your number is Three");
}
else
{
alert("Your number is not between 1 and 3");
}
❑ The above code can be rewritten using a switch statement and it greatly improves the readability.

<script>
var userInput = Number(prompt("Please enter a number", "")); switch (userInput)
{
case 1:
alert("You number is One");
break;
case 2:
alert("You number is Two"); break;
case 3:
alert("You number is Three"); break;
default:
alert("You number is not between 1 and 3"); break;
}
</script>
❑ In general we need to have break statement after each case statement to ensure the
program breaks out of the switch statement after executing statements present in a specific
case.

❑ What happens if there is no break in a switch


statement
❑ If there is no break statement the execution falls automatically to next case until a break
statement is encountered or end of the program is reached.

❑ In the example below, since we don't have a break statement for case 1, when we enter 1 as the
number we would get 2 alerts. First alert from case 1 and the second alert from case 2.
<script>
var userInput = prompt("Please enter a number", ""));
switch (userInput)
{
case 1:
alert("You number is One"); case 2:
alert("You number is Two"); break;
case 3:
alert("You number is Three"); break;
default:
alert("You number is not between 1 and 3"); break;
}
</script>
❑ When would you combine multiple case statements together

❑ If you want the same piece of code to be executed for multiple cases
you can combine them together as shown below. Case statement
with no code in-between creates a single case for multiple values. A
case without any code will automatically fall through to the next
case.
❑ In this example case 1 and case 2 will fall through and execute code for case 3
var userInput = Number(prompt("Please enter a number", "")); switch
(userInput)
{
case 1:
case 2:
case 3:
alert("You number is " + userInput); break;
default:
alert("You number is not between 1 and 3"); break;
}
Loops in JavaScript

✔ Loops are used to execute a segment of code repeatedly until


some condition is met.
❑ Here are the basic loops in JavaScript
while

do...while

for

For ..in loop


while loop
:
1. while loop checks the condition first

2. If the condition is true, statements with in the loop are executed

3. This process is repeated as long as the condition evaluates to


true.
Flowchart of JavaScript while
Loop
❑ we will discuss while loop in JavaScript with an example.

❑ The following example,

❑ prints all even numbers from 0 till the target number that the end user
has provided.
<script type="text/javascript">
var targetNumber = Number(prompt("Please enter
your target number", ""));
var start = 1;
while (start <= targetNumber)
{
if(start%2==0)
{
document.write(start + "<br/>");
}
start = start + 1;
}</script>
for Loop :-

▪ The for loop consists of the for keyword followed by three expressions separated by semicolons
and enclosed within parentheses.

▪ Any or all of the expressions can be omitted, but the two semicolons cannot.

▪ The first expression is used to set the initial value of variables and is executed just once, the second
expression is used to test whether the loop should continue or stop, and the third expression
updates the loop variables; that is, it increments or decrements a counter, which will usually
determine how many times the loop is repeated.
FORMAT

for(Expression1;Expression2;Expression3)
{
statement(s);
}

for(initialize; test; increment/decrement)


{
statement(s);
}
EXAMPL
E
<html>
<head>
<title>My Page Title</title>
</head>
<body>
<b>Testing the alert method</b> <br />
<script type="text/javascript">
for( var i = 0; i < 10; i++ )
{
document.write(i);
}
</script>
</body>
</html>
EXPLANATIO
N
▪ The for loop is entered.

▪ The expression starts with step 1, the initialization of the variable i to 0. This is
the only time this step is executed.

▪ The second expression, step 2, tests to see if i is less than 10, and if it is,
the statements after the opening curly brace are executed. When all statements in the
block have been executed and the closing curly brace is reached, control goes
back into the for expression to the last expression of the three. i is now
incremented by one and the expression in step 2 is retested. If true, the block of
statements is entered and executed.
▪ The value of i is displayed in the browser window ().

▪ The closing curly brace marks the end of the for loop.
Let’s see the simple example of for loop in
JavaScript.
<html>
<head>
<title>My Page Title</title>
</head>
<body>
<script type="text/javascript">
for( var i = 1; i < =10; i++ )
{
document.write("<body bgcolor='skyblue'>");
document.write("<b>"+(5*i) + "</b><br/>");

}
</script>
</body>
</html>
JavaScript do while loop
The JavaScript do while loop iterates the elements for the infinite number
of times like while loop. But, code is executed at least once whether
condition is true or false.
The syntax of do while loop is given below.

do{
code to be executed
}while (condition);
For…in loop in javascript

The for...in loop is used to loop through an


object's properties.
As we have not discussed Objects yet, you may
not feel comfortable with this loop. But once you
understand how objects behave in JavaScript, you
will find this loop very useful.
The syntax of for in loop is given below.
for (variablename in object){
statement or block to execute
}
For…in loop in javascript
<html>
<head>
<title>My Page Title</title>
</head>
<body>
<script type="text/javascript">
const string = 'code';
// using for...in loop
for (let i in string) {
document.write(string[i]+ "<br/>");
}
</script>
</body>
</html>

You might also like