JavaScript
(Control Statement)
Sungchul Lee
Outline
➢Comparison and Logical Operators
❑Boolean
❑true/false
➢Control Statement
❑Control flow using comparison and logical operators
Boolean
➢Boolean represents one of two values: true or false.
➢For Example:
var isItTrue = false;
Boolean(10 > 9) //returns true;
➢Compare two variables using Comparison operators and
logical operators to get true or false
❑In Math: a<b
Comparison Operators
When x = 5
Operator Description Comparing Returns
➢Comparison operators == equal to x == 8 false
are used in logical x == 5 true
statements to determine x == "5" true
equality or difference === equal value and equal type x === 5 true
between variables or x === "5" false
values != not equal x != 8 true
❑Used to test for true or !== not equal value or not equal
type
x !== 5 false
false x !== "5" true
x !== 8 true
> greater than x>8 false
< less than x<8 true
>= greater than or equal to x >= 8 false
<= less than or equal to x <= 8 true
Logical Operators
➢Logical operators are used to determine the logic between
variables or values.
❑Use more comparison Operators in Control Statement
When x = 6 and y = 3
Operator Description Example
&& and (x < 10 && y > 1) is true
|| or (x == 5 || y == 5) is false
! not !(x == y) is true
Conditional Ternary Operator
➢Conditional ternary operator that assigns a value to a variable
based on some condition.
❑Syntax:
❖variablename = (condition) ? value1:value2
❑Example:
❖var voteable = (age < 18) ? "Too young" : "Old enough";
Conditional Statements Structure
➢The Conditional structure specifies alternate courses of program
flow, creating a junction in your program (like a fork in your road).
➢if
−Perform an action if a condition is true; skip it, if false.
➢if … else
−Perform an action if a condition is true and perform a different
action if the condition is false.
➢switch
−Perform on of several actions based on the value of an
expression.
if Statement (if)
➢Use if to specify a block of code to be executed, if a specified
condition is true
❑Syntax:
❖if (condition) {
// block of code to be executed if the condition is true
}
❑Example:
if (studentGrade >= 60) {
var grade= “Passed”
}
if Statement (if) - Example
if (studentGrade >= 60) {
var grade= “Passed”
}
false studentGrade >= true
60
Passed !
if/else Statement
➢Double - selection statement specify an action to perform when
the condition is true and a different action when the condition is
false.
➢Use else to specify a block of code to be executed, if the same
condition is false
❑Syntax:
❖if (condition) {
// block of code to be executed if the condition is true
} else {
// block of code to be executed if the condition is false
}
if/else Statement - Example
Condition true or false
true false
studentGrade >= 60 ?
var grade= “Passed!”
if ( studentGrade >= 60) { var grade=“Failed !”
var grade= “Passed!”}
else {
var grade=“Failed !” }
else if statement
➢Use the else if statement to specify a new condition if the first
condition is false.
➢ Very useful to test various conditions using if/else if statement
❑Syntax:
if (condition1) {
// block of code to be executed if condition1 is true
} else if (condition2) {
// block of code to be executed if the condition1 is false and condition2 is true
} else {
// block of code to be executed if the condition1 is false and condition2 is false
}
else if statement - Example
➢In most cases, more than two situations
❑Example: Convert a numerical score into a symbolic score
(A,B,C,D,F)
❑Basic if/else statement is not enough
❑Need more complicated statements
❖If/else if/else
else if statement - Example
Practice 1
=== equal value and equal x === 5 true
type
x === "5" false
➢Template strings
❑back-tic, backquote (`)
▪ Can contain placeholders
❑Indicated by the dollar sign and
curly braces
▪ `${}` Type
convert
Switch Statement
➢The switch statement is used to perform different actions based
on different conditions.
❑Syntax:
switch(expression) {
case x:
// code block
break;
case y:
// code block
break;
default: // like else keyword in ‘if else’ statement
// code block
}
Switch Statement - Example
switch (input) {
case '+': true
console.log(a+b); input== “+” ? a+b;
break;
case '-’: false break;
console.log(a-b); true
input== “-” ?
a-b;
break;
case '/’:
false break;
console.log(a/b);
true
break; input== “/” ? a/b;
}
false break;
break means that the
execution of the whole
switch block ends
Practice 2
➢default:
❑Handle the rest of case
Summary
➢Comparison and Logical Operators
❑Boolean
❑true/false
➢Control Statement
❑if
❑if else
❑if, else if, else
❑switch
