Conditional statements and logic

- [Instructor] A lot of programming is about testing for conditions, asking if some condition is met, then do this, otherwise do something else. This is done using conditional statements and logic operators. The classic conditional is an 'if' statement. It looks like this, if some condition is true, then do something. Here, the parenthesis wrap the condition, or conditions, and the curly braces wrap what happens if the condition is met. This is known as the code block. You could technically write this all on one line, but that would be hard to read for the humans who will be looking at your code, so always use this structure with the if statement, the condition, and the first curly brace on one line, then the code block inside, indented to the right, and then finally, end on its own line, with a closing curly brace.

On its own, the if statement is an on/off switch. If the condition is true, whatever is inside the statement and the code block will run, otherwise we just move on to the next statement in the code. If you want to create an if/else statement, where you perform a separate specific action if the condition is not met as well, you add else, and a new set of curly braces after the if statement, like this. If some condition is true, do something, else, so it's not true, then do something else. If statements require conditions to work, so we need some logic operators.

The most obvious one is equality. If a is equal to b, then do something. Earlier, you learned that a single equal symbol is used for assignment, so to check a quality, we use two equal symbols. This checks if the value on the left is the same as the value on the right. In the exercise files for this movie, 03_05, you'll find just such a conditional statement. Here we have the two variables a and b set to five, we have an undefined variable, the numbers match, then we say if a equals b, then we set the numbers match to true, otherwise we set it to false, then we console log out the numbers match, colon, and the value of the numbers match.

I'm using atom live server here, to display this in my browser, and in my console you see currently it says the numbers match, true, because we're matching five to five. If I go and change this now to four, and save, it says the numbers match, false. It's really that straightforward. Now that you see how it works, let me bring up something that happens all the time when you start learning how to write JavaScript. It's very common to forget that testing for a quality requires two equal symbols, so a lot of the time, you'll put in just a single equal symbol, because that's how we're used to using the equal symbol, and what happens if you do that is the value of b is assigned to a, and therefore the condition will always be true, so even though we have a is five and b is four here, it's set to true over here on the console because if I ask for a you'll see a is four, which is the value of five.

So as a rule of thumb, every time you're doing a test for equality, it's a good idea to go to your console and check what the actual values you are comparing are to make sure you're not passing one value into the other. After a while you'll get used to typing in two equal signs, in fact you'll do it so much that you'll start doing it in other places where it doesn't make any sense to, I find myself doing it all the time when I'm trying to find out if two things are equal to each other, and it can be really weird for anyone who doesn't know how to write code. The interesting thing about measuring equality with two equal signs is it's actually pretty lenient.

So if I change my example here back to five equals five, and then change the second value to string, you'll see it still returns true. That's because just like previously, JavaScript figures out the value of this string is five, and five is the same as five, so therefore, a equals b. Now if we want to test strict equality, meaning the contents of the variable a is identical to the contents of the variable b, we use three equal symbols.

This returns false, because they're not exactly the same, and it's a great way of testing absolute strict equality. Now you'll find in most cases you'll actually want to use the two equal symbols, because you want to give JavaScript some wiggle room, but if you ever need to test to see if two things are identical, three symbols is the way to go. Along the same vein, we can also test whether one value is less than or greater than another, using the standard greater than or less than symbols, and if we want to test if a value is greater than or equals to, or less than or equals to, we combine two symbols, like this, less than/equals, or greater than/equals.

Now anytime we talk about logic we also have to account for opposites. So for example a condition where a value is not equal to another value. This is done using the exclamation point, or bang. If you want to see if a is not equal to b, you type in if a bang equals b. If you want to test for not strict equality you do the same thing, if a bang equals, equals, b. So what you see here is we're replacing the first equal symbol with a bang.

The bang also comes into play in other places in more advanced conditions. Let's say, for example, we have a variable holding a Boolean value, so true or false, and we want to test if it's true. We can use longhand and say if a equals, equals, true, or shorthand, simply say if a, and if we want to test if it's not true, so false, we either say if a equals, equals false, or, if a bang equals true, or if bang a, they all return the same value.