unsungNovelty

initLogs 2: Three uses of if statement in JavaScript

Nikhil's photo
Nikhil
·

4 min read

Table of contents

If statement is one of the conditional statements in JavaScript. But if is not the most commonly used conditional statement, at least not when you are new to JavaScript. That would be the if-else or nested if else statement. As a person who is new to JS, the learning materials or the execrises never teach you the real world use cases of an if statement. It is always a basic explanation with a basic example after which the materials often move to if-else.

This has bothered me because I always wonder about the use of an if statement is in JavaScript. I mean, we always need a else part while writing the if statements right?

So, what are the usecases for an if statement? Here are some.

1. As a minimal version of if-else


function biggest (a, b) {

    if (a > b) {
    console.log("A is greater");
    }
    console.log( "B is greater");
}

biggest (5, 6);

// -> B is greater.

The above example is for checking if a > b or not. Here, you don't need to add an else part to check if a < b. It is known that if a > b is true what to execute and if it is false, what to execute. This is one way to use if statements. But this technically has an else part to execute when the initial condition is not satisfied. So where else can we use if statements?

2. To replace switch statements

You can essentially write if statements instead of writing switch statements. if statements are easier to write and easier to understand compared to switch statements.

Here is a switch statement:


  function howMuchFor(expr) {
    switch (expr) {
      case 'Oranges':
        console.log('Oranges are $0.59 a pound.');
        break;
      case 'Apples':
        console.log('Apples are $0.32 a pound.');
        break;
      case 'Bananas':
        console.log('Bananas are $0.48 a pound.');
        break;
      case 'Cherries':
        console.log('Cherries are $3.00 a pound.');
        break;

      case 'Mangoes':
      case 'Papayas':
        console.log('Mangoes and papayas are $2.79 a pound.');
        break;

        default:
        console.log('Sorry, we are out of ' + expr + '.');

    }

    console.log("Is there anything else you'd like?");
  }


howMuchFor('Cherries');

// -> Cherries are $3.00 a pound.
// Is there anything else you'd like?

This can be replaced with if statements like...


function howMuchFor (expr) {
    if (expr === 'Oranges') { console.log( expr + ' are $0.59 a pound.'); }
    if (expr === 'Apples') { console.log( expr + ' are $0.32 a pound.'); }
    if (expr === 'Bananas') { console.log( expr + ' are $0.48 a pound.');}
    if (expr === 'Cherries') { console.log( expr + ' are $3.00 a pound.'); }
    if (expr === 'Mangoes' || 'Papayas') { console.log( expr + ' are $2.79 a pound'); }
}

howMuchFor('Mangoes');

// -> Mangoes are $2.79 a pound.

Which do you think is easier to write and easier to understand? The one with switch or the one with if?

3. Then there is another usecase... validating!

This is something I learnt while doing a side project (R.I.P) and thought was really interesting. This is the reason I wrote this blog post, because I was not sure if all the people who have just started to learn JavaScript knows about this.

The function I wrote in the project was essentially doing some CRUD (Create, Read, Update, Delete) operations. My friend told me to use if statements to validate the user inputs and I was like wow, this is a great usecase for an if statement!

So, let's see how to validate using if statement...


let infoDB = {
    firstName: 'Bob',
    lastName: '',
    age: 37
}

if(!infoDB.firstName) {console.log( "Please provide a first name to add your complete information.");} 
if(!infoDB.lastName) {console.log("Please provide a last name to add your complete information.");}
if(!infoDB.age) {console.log( "Please provide a first name to add your complete information.");}

console.log(infoDB);

// -> Please provide a last name to add your complete information.
// Final infoDB object -> { firstName: 'Bob', lastName: '', age: 37 }

The way to read the above statement is if NO (for !) first name in myCompleteInfoDB, do something. Or if NO last name in myCompleteInfoDV, do something and if NO age in myCompleteInfoDB, do something. Although this is very simple and somewhat not a very useful program, this shows how you can validate things using an if statement.

That is it! These are some use cases for using if statements in JavaScript. I know this is just a very basic thing for most of the people. But since it was not covered in the learning resources I used, it really was fascinating to me to know that we can use an if statement in all these ways!

Found this article interesting or found a mistake/room for improvement? Please DM/Tweet me @unsungNovelty. This is a part of a series of blogs called #initlogs which shares some interesting things I found while learning to code.

This post was first published under the title "Secret life of ifs" at unsungnovelty.org

JavaScriptnewbie#codenewbies