Working with the if Conditional Part 1

Modern JavaScript Using Control Structures
6 minutes
Share the link to this page
Copied
  Completed

Transcript

Let's dive a bit deeper into the if conditional or the if statement. In order to do that, let's bring up sublime again, we're going to enter some JavaScript code. And then we're going to execute it with the HTML page that we have attached that JavaScript page to. So first off, let's declare a variable, we'll use this variable in our first, if conditional. We're not going to assign it a value, we're simply going to declare it. Now let's take a look at an if statement that could be used to determine if this variable has a value or not.

A logical situation for this would be a website where you're keeping track of a user, you want to see if a value has been entered for a user. We always start with F and then in parentheses, we include The conditional statement, we need to check something. That's what the purpose of the parentheses is. In this case, we're checking the username variable. So we enter username. And then we want to see if it's equal to undefined.

So we're going to use the strict equality operator. And then we simply type undefined. So that's our conditional statement. It consists usually of a variable, then an operator, and then some value. That's not always the case. We'll look at some some other examples a little bit later on.

But generally, you're going to include some sort of operator when you're testing the, the value. All right, once you've done the conditional statement inside the parentheses, you then enter the curly braces. This first set of curly braces, this code will execute if the conditional evaluates to true. So if, if the username is equal to undefined, then we're simply going to log in message to the console that says user is not defined. Then we'll we'll conclude that with a semicolon. Now what if the user is defined what if the conditional evaluates to false?

Well, that's where we put the else. Statement else clause of this The if statement. We then use curly braces again. In this case, we will log to the console. The Massey user is and then we will also concatenate the username so we can print out who the user is. All right.

So that's a simple if statement that we've done let's go ahead and save that. We're going to open that up. By opening this this HTML page slummy paste the path and and now Let's display the console. Now I've docked the console to the bottom so we can see what's going on. So first it indicates user is not defined. All right?

That's what we expected. Because if we look at the code, we did not define a user. But let's say that now. username variable get set to some value. And then with a semicolon. Now what will we see once we refresh this page?

We will see the username is James. And so there's our first if conditional or if statement. All right, I'm going to comment this out and sublime. I can do that by selecting everything and then entering command. And it will come out every line that way. I don't have to go to each line and comment that out.

And now let's do a second exercise with conditional statements. So define it Variable num and set that equal to five. Okay, we're going to do a conditional to determine if this number is even or odd. Obviously looking at it, we can tell, but what if we needed the program to determine whether it was even or odd. This is the way we could do that. So first I'm creating a second variable and I'm setting that equal to num modulo two.

Remember the modulus operator, it returns the remainder. So in this case, we know this is going to return a one into mod. So now let's do our if statement. If mod is equal to zero, if it's equal to zero, that means the number is even. So we're going to log to the console. Log the contents of the variable and also indicate whether it's even or odd.

So now we'll do our eltz portion and log to the console. That num is odd. And put our semi colon in. All right, let's go ahead and see how that one works. I'm gonna save that I'm gonna jump to the browser. Let's go ahead and refresh it looks like we made a mistake in the cold code notice uncaught reference error console log is not defined.

Based on looking this it looks like I did not enter console dot log correctly. I did not enter a period there. Sure enough, I should have been able to see that before I saved jump To the to the browser. Let's go back to the browser again. Go ahead and refresh. Five is an odd number it tells us Okay, so let's change the value of that to something that's even save it.

Jump back, refresh. 12 is an even number. All right, so we've had two examples of if conditionals. In both cases, the operator we've used in the conditional statement has been an equality operator. Now notice in in some of these, we could have done just the opposite, we could use the inequality operator. Here.

If mod is not equal to zero, then we would first log that it's an odd number. Else we would log it's an even number. So we could have done the same thing with an inequality operator.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.