Page 1 of 7
SQL HTML CSS Javascript Python Java C C++ PHP Scala C#
JavaScript - if...else Statement
The JavaScript if...else statement executes a block of code when the specified condition is true.
When the condition is false the else block will be executed. The if-else statements can be used to
control the flow of execution of a program based on different conditions.
While writing a program, there may be a situation when you need to adopt one out of a given set of
paths. In such cases, you need to use conditional statements that allow your program to make correct
decisions and perform the right actions.
JavaScript supports conditional statements used to perform different actions based on different
conditions. Here we will explain the if...else statement.
Flow Chart of if-else
The following flow chart shows how the if-else statement works.
JavaScript supports the following forms of if...else statement −
Page 2 of 7
if statement
if...else statement
if...else if... statement.
JavaScript if statement
The if statement is the fundamental control statement that allows JavaScript to make decisions and
execute statements conditionally.
Syntax
The syntax for a basic if statement is as follows −
if (expression) {
Statement(s) to be executed if expression is true
}
Here a JavaScript expression is evaluated. If the resulting value is true, the given statement(s) are
executed. If the expression is false, then no statement would be not executed. Most of the times, you
will use comparison operators while making decisions.
Example
Try the following example to understand how the if statement works.
Open Compiler
<html>
<body>
<div id ='output'> </div>
<script type = "text/javascript">
let result;
let age = 20;
if( age > 18 ) {
result = "Qualifies for driving";
}
[Link]("output").innerHTML = result;
</script>
<p> Set the variable to a different value and then try... </p>
Page 3 of 7
</body>
</html>
Output
Qualifies for driving
Set the variable to different value and then try...
JavaScript if...else statement
The 'if...else' statement is the next form of control statement that allows JavaScript to execute
statements in a more controlled way.
Syntax
if (expression) {
Statement(s) to be executed if expression is true
} else {
Statement(s) to be executed if expression is false
}
Here JavaScript expression is evaluated. If the resulting value is true, the given statement(s) in the if
block, are executed. If the expression is false, then the given statement(s) in the else block are
executed.
Example
Try the following code to learn how to implement an if-else statement in JavaScript.
Open Compiler
<html>
<body>
<div id ='output'> </div>
<script type = "text/javascript">
let result;
let age = 15;
if( age > 18 ) {
result = "Qualifies for driving";
Page 4 of 7
} else {
result = "Does not qualify for driving";
}
[Link]("output").innerHTML = result;
</script>
<p> Set the variable to a different value and then try... </p>
</body>
</html>
Output
Does not qualify for driving
Set the variable to different value and then try...
JavaScript if...else if... statement
The if...else if... statement (also called as if...else ladder)is an advanced form of ifelse that allows
JavaScript to make a correct decision out of several conditions.
Syntax
The syntax of an if-else-if statement is as follows −
if (expression 1) {
Statement(s) to be executed if expression 1 is true
} else if (expression 2) {
Statement(s) to be executed if expression 2 is true
} else if (expression 3) {
Statement(s) to be executed if expression 3 is true
} else {
Statement(s) to be executed if no expression is true
}
There is nothing special about this code. It is just a series of if statements, where each if is a part of
the else clause of the previous statement. Statement(s) are executed based on the true condition, if
none of the conditions is true, then the else block is executed.
Example
Try the following code to learn how to implement an if-else-if statement in JavaScript.
Page 5 of 7
Open Compiler
<html>
<body>
<div id ="demo"></div>
<script type="text/javascript">
const output = [Link]("demo")
let book = "maths";
if (book == "history") {
[Link]="<b>History Book</b>";
} else if (book == "maths") {
[Link]="<b>Maths Book</b>";
} else if (book == "economics") {
[Link]="<b>Economics Book</b>";
} else {
[Link]="<b>Unknown Book</b>";
}
</script>
<p> Set the variable to a different value and then try... </p>
</body>
<html>
Output
Maths Book
Set the variable to different value and then try...
TOP TUTORIALS
Python Tutorial
Java Tutorial
C++ Tutorial
C Programming Tutorial
C# Tutorial
PHP Tutorial
R Tutorial
Page 6 of 7
HTML Tutorial
CSS Tutorial
JavaScript Tutorial
SQL Tutorial
TRENDING TECHNOLOGIES
Cloud Computing Tutorial
Amazon Web Services Tutorial
Microsoft Azure Tutorial
Git Tutorial
Ethical Hacking Tutorial
Docker Tutorial
Kubernetes Tutorial
DSA Tutorial
Spring Boot Tutorial
SDLC Tutorial
Unix Tutorial
CERTIFICATIONS
Business Analytics Certification
Java & Spring Boot Advanced Certification
Data Science Advanced Certification
Cloud Computing And DevOps
Advanced Certification In Business Analytics
Artificial Intelligence And Machine Learning
DevOps Certification
Game Development Certification
Front-End Developer Certification
AWS Certification Training
Python Programming Certification
COMPILERS & EDITORS
Online Java Compiler
Online Python Compiler
Online Go Compiler
Online C Compiler
Page 7 of 7
Online C++ Compiler
Online
HomeC# Compiler
Whiteboard AI Assistant Online Compilers Jobs Tools Articles
Online PHP Compiler
Online Chapters
MATLAB Compiler Categories
Online Bash Compiler
Online SQL Compiler
Online Html Editor
ABOUT US | OUR TEAM | CAREERS | JOBS | CONTACT US | TERMS OF USE |
PRIVACY POLICY | REFUND POLICY | COOKIES POLICY | FAQ'S
Tutorials Point is a leading Ed Tech company striving to provide the best learning material on technical
and non-technical subjects.
© Copyright 2025. All Rights Reserved.