Conditional Statements













The if keyword:

if (true) {
console.log('This message will print!'); 
} 
// Print: "This message will print!"

Here, inside the parentheses remains condition, Inside the curly braces remain code of blocks or block statements. Explanation : If the condition is true, then a block of code or block statement will execute or run. If the condition is false, then the block of code or block statement will not execute or run.

If...Else Statements :

When the condition of the if statement is true, then the codes of block or block statement inside the if statement will execute or run.


if (true){
    console.log('The code in this block will run.');
} else {
    console.log('But the code in this block will run!');

// Print: "The code in this block will run."

When the condition of the if statement is false, then the codes of block or block statement inside the if statement will execute or run.


if (false) {
    console.log("The code in this block will not run");
} else {
    console.log("But the code in this blog will run!");
}

// Print: "But the code in this blog will run!"

N.B → Code inside the parentheses() is called condition. Code inside the curly braces{} is called code of block or block statement.


Comparison operators:

When we write a conditional statement, sometimes we need different types of operators to compare values. Here is a list of some handy comparison operators and their syntax: Less than: < Greater than > Less than or equal to <= Greater than or equal to >= Is equal to === Is NOT equal to: !== Comparison operators compare the value on the left with the value on the right. All comparison statements evaluate as either true or false.


identity operator (===) checks the value as well as type.


When operators work with booleans, true or false are called logical operators.

There are three logical operators:

  • the and operator (&&)
  • the or operator (||)
  • the not operator, otherwise known as the bang operator (!)


The and operator (&&) :


if (stopLight === 'green' && pedestrians === 0) {
  console.log('Go!');
} else {
    console.log('Stop');
}


When both values of the condition are true, it will execute or run inside the if statement. If any of the values of the condition is false, it will not execute the codes of block or block statement of if statement. If the first value is false, then it will check the second value.



The or operator (||) :


if (day === 'Saturday' || day === 'Sunday') {
   console.log('Enjoy the weekend!');
} else {
      console.log('Do some work.');
}    


If any of the values of the condition becomes true, then it will execute or run the codes of the block or block statement inside the if statement. When both the values are false, it will not execute the code inside the if statement.


The not or bang operator

let sleepy = true;
console.log(!sleepy); // print: false

let sleepy = false;
console.log(!sleepy); // print: true


If so! the operator takes the true value, and it will pass back the false value. Or If so! the operator takes the false value, and it will pass back the true value. 


Truthy and Falsy:

Sometimes, we want to check if a variable exists and don’t need to equal a specific value and only check if the variable has a value. This is the truthy value.


let myVariable = 'I Exist!';
if(myVariable) {
    console.log(myVariable)
} else {
    console.log('The variable does not exist');
}

The list of falsy values: 

  • 0
  • Empty strings like "" or ''
  • null which represents when there is no value at all
  • undefined which represents when a declared variable lacks a value
  • NaN, or Not a Number


Truthy and Falsy Assignment or short circuit evaluation:

By truthy falsy assignment, we can apply conditions like truthy or falsy and assign it to a variable.


let tool = "marker";
let writignUtensil = tool || 'pen';

// Use short circuit evaluation to assign  writingUtensil variable below:

let writingUtensil = tool || 'pen';

console.log(`The ${writingUtensil} is mightier than the sword`);

In the example above, || or statements check the left-hand condition (tool) first, if the condition is truthy, then the value is assigned to the variable writingUtensil. If the left-hand condition (tool) is false, then || or statement will check the right-hand condition and assign the value to variable writingUtensil.



Ternary operators: 

We can simplify the if… else statement by ternary operators.











In the example above:

  • The condition, isNightTime, is provided before the ?.
  • Two expressions follow the? and are separated by a colon:.
  • If the condition evaluates to true, the first expression executes.
  • If the condition evaluates to false, the second expression executes.

 

Else If Statements :

If we want more than two possible outcomes, then we can use else if statements.

It is used after the if statement and before the else statement.


let stopLight = "yellow";
if(stopLight) {
    console.log("Stop!");
} else if(stopLight === "yellow") {
    console.log("slow down");
} else if(stopLight === "Green") {
    console.log("Go!");
} else {
    console.log("Caution, Unkonwn");
}



Where the condition is true, then it will execute or run the code. After that, it will not evaluate the following codes. If any of the conditions are not true, then it will execute the code block or block of codes inside the else.



Switch statement : 

We can write a switch statement as an alternative to the else if statement. 


let groceryItem = "papaya";
switch(groceryItem) {
    case 'tomato':
    console.log("Tomatoes are $0.49");
    break;
          
    case 'lime': 
    console.log('Limes are $1.49');
    break;

    case 'papaya': 
    consle.log('Papayas are $1.29');
    break;

    default: 
    console.log('Invalid item');
    break;
}


Switch statement structure:

Parentheses contain the condition of the switch statement and curly braces contain the codes of the block or block statement. case keyword checks if the expression matches the value specified in the condition. When matches it executes the code and the keyword break tells the computer to exit the block and not to execute any more code or check any other cases inside the code block. Here default value will show if any condition evaluates to true.


Post a Comment

Previous Post Next Post