JavaScript If Statement

The if statement is the main programming concept that allows you to run the code if the specified conditions are true. It is also known as the Conditional Statement.

You will learn two common forms of JavaScript if Statement, and they are:

if statement
if-else statement

The `if` statement

The if statement is probably the simplest and most frequently used method to check the conditions.

What it does is when the specified conditions are true, the code will run. And if it is not true, nothing will run.

To create an if statement, you will declare it with the if keyword. Then, you will add the conditions inside the brackets (). The code inside the brackets is also known as Expression.

Finally, you will create another bracket with curly braces {} and inside the curly braces, you will insert the code called Statement. The statement is a code that will run if the condition has been met.

This is how a simple if statement syntax looks like:

if (condition) {
    // this code will run if the condition is true
}

And here is a practical example of an if statement:

let studentScore = 82;
let passingScore = 60

if (studentScore > passingScore) {
    console.log("You have passed the test");
}

In this example, we check whether the student has passed the test.

Since the student’s score is 82 which is higher than the passing grade, the student has passed the test and thus it will run the code You have passed the test.

If you try to change the student value to 60 or less, the console.log will not run as the condition is not true anymore.

The `if-else` statement

More often than not, you want to check if the specified conditions are true and run the first statement. And if the condition is false, another statement will run instead.

In this case, the if-else statement is used. The if-else statement is another type of conditional statement that has two outcomes.

Here’s how the syntax of the if-else statement will look like:

if (condition) {
    // this code will run if the condition is true
} else {
    // this code will run if the condition is false
}

The difference between the if statement and the if-else statement is that another keyword is included which is the else keyword. The else statement will run if the first condition is not true.

For example:

let studentScore = 82
let passingScore = 60

if (studentScore > passingScore) {
    console.log("You have passed the test");
} else {
    console.log("You have not passed the test");
}

In this example, it will check if the student passes the test. It will run the first statement You have passed the test because of the condition and the student has passed the test.

Alternatively, if you replace the student value 82 with 42, the condition will now be false and thus it will run the second statement You have not passed the test.

Coding tasks

Time to test your knowledge for this lesson by writing code. Read the instructions carefully before attempting the tasks.

The first and second tasks will involve adding a new code to get the desired output. In the third and fourth tasks, you will change the existing code to fix the problem.

After completing each task, make sure to hit the “RUN” button to check the results.

Task 1

Let’s create a simple if statement. Write the following command in the editor and the output should display You are awesome! when you hit the “RUN” button.

let isCoding = true;

if (isCoding) {
  console.log("You are awesome!");
}

Task 2

For this task, you will create a simple if-else statement. Write the following command in the editor, and the output should display It is the weekend. Have a great time, warrior! when you hit the “RUN” button.

let isCoding = false;

if (isCoding) {
  console.log("You are awesome!");
} else {
  console.log("It is the weekend. Have a great time, warrior!");
}

Task 3

This code is broken, and it is not working well. Find out what’s causing the problem and fix it.

let age = 24;

if age > 17 {
    console.log("You are qualified to drive cars");
}

Hint: Use the bracket symbols () for this task.

Task 4

A mistake has been made in this code and is throwing an error. Find out the source of the problem and fix it.

let age = 33;

if (age > 17) {
  console.log("You are qualified to drive cars");
} if {
  console.log("You are not qualified to drive cars yet");
}

Hint: There is one keyword that is not supposed to be there and should be replaced with the correct one.

The if statement

The if-else statement