I want to start with conditional code execution which is super important. For one, there are certain, quite
a lot of cases, of scenarios which you couldn't really solve or couldn't really handle without the availability
of conditional code execution, so without features that help you run code based on certain conditions.
The app we built thus far could be built without conditional code but that's not the case for all apps and
in addition, even if you can build an app without conditional code execution, like our basic calculator,
you can still opt to write cleaner code, shorter code if you can run certain parts of your code conditionally.
Now what does conditional code execution mean?
Imagine that you have a function and conditional code execution is not just available inside of
functions by the way
but consider that you have a function and in there, you have two code snippets that you could execute,
for example you either add two numbers or you subtract two numbers. You do that in the same function
and of course you could write two separate functions but even then, you might want to call one of the
two functions based on some condition
and that's exactly what conditional code execution is about.
You might have some program where you either want to run option A, so want to add two numbers or you
want to subtract two numbers.
So you have some condition that needs to be met
and for this you can use a so-called if statement. If statements are a core construct, not just in Javascript
but actually in any programming language you can learn. Now if statements require conditions, you specify
a condition that must be met and a condition is in the end just a boolean value.
You remember that strange boolean part I mentioned earlier in the course?
Well that's becoming important right now.
This was this special kind of value which could only be true or false but that's exactly what you need
in a condition because a condition executes code A
if it's true or code B if it's false. Now since a condition in an if statement was in the end just true
or false, you can always pass in a variable that holds true or false into that condition part, so
you can always add if and then just check that variable and the value in there. That is possible but
you will not always have a variable that holds true or false,
you will need to create that and more often than not, you'll work with different kinds of data,
let's say you have some user input which is a string or you're working with some numbers,
the result of a calculation and therefore often you need to dynamically derive a boolean value and you
can do that thankfully with the help of some boolean operators, also known as comparison operators because
these are operators built into Javascript, just like plus, minus, the times operator and so on which don't
yield a new number or a new string as a result but which instead return or yield true or false
and there, you for example have the equality operator.
This double equal sign operator and that's important,
these are two equals signs, the single equals sign was used for assigning a value to a variable or constant,
the double equals sign operator is used to compare two values and then return true or false and you
use it to check for value equality.
So for example, you compare the variables a and b and if they hold the same value, this would yield true.
So you could use that comparison here in the condition or as a condition in an if statement.
Of course you also can check for values not being equal,
you do this with the exclamation mark in front of the equals sign and important here,
you only have one equals sign, so the other equal sign is basically replaced by the exclamation mark
here.
This checks for value inequality and therefore you could check if a and b are not equal and only execute
some code if that's the case. Now there also is a special form of these two operators.
You also have the equality operator with three equal signs and therefore also the not equal operator
with an exclamation mark and two equal signs.
Now what's the difference to the first two operators I showed you?
Well, the triple equal sign operator checks for value and type equality or with the exclamation mark,
for inequality.
Now what's the difference here?
To find out, let's just dive here in the console, in the browser developer tools on any web page of your
choice, like our calculator
but that really doesn't matter
and in there, you can quickly play around with these operators.
Now let's start with the double equal sign operator,
let's see what the result is if I compare two to two.
Now of course, we get true as a result because these two values are equal.
Now needless to say that in your program of course, you won't hardcode a comparison like this,
that's redundant because that will always yield true,
instead you might be comparing two values entered by the user, for example with the input like this where
you don't know the value in advance,
I'm just using hardcoded values here to show how these operators work.
So this yields true but you also get true if you compare two to a string that holds a value of two
and that's what the double equality operator does.
It checks for value equality only,
it doesn't care whether the two values you are comparing are of the same type.
That would be the case with triple equal signs though, there for two numbers being compared,
if they have the same value, we get true but if I compare this to a string with the value two, I get
false,
so that's the important difference here
and the same, just the opposite of course is the case with the negation,
so with the exclamation mark. Now typically in Javascript, you should prefer the triple equals sign or not
equal operator over the double equals sign or not equal operator simply because it forces you to write
better code.
You should care about the types of values you working with,
for example if you're checking some user input and you're comparing it whether it's equal to some number,
well you should first convert the user input to a number so that you can use the triple equal sign operator.
It makes your intentions clear and it also avoids cases where a user might not enter a number at all,
it would be better to then handle that case before you use the number instead of just getting a false
result in a condition here.
So typically, you want to use the triple equal sign operator just because it forces you to write more
explicit and clearer code.
Now of course, you can also not just check for equality or inequality, you can also compare numbers
for being greater or smaller,
so that's also available where you can check if number a or input a is bigger or smaller than input
b.
Now both the equality and the greater than and so on
operators can be used with numbers but also with strings,
obviously you can compare two strings for being equal but you can actually also use the greater than
operator for example with two strings to check if one string is greater than another string in a
lexical graphic way which means c would be greater than a because it's greater than a in an English dictionary.
Now besides greater or smaller than, you also have the combined greater than or equal or smaller than
or equal operators which allow you to compare values for being smaller or equal or greater or equal,
which of course makes sense because sometimes you want to include the value in the comparison and not
just check for whether the other value is greater or smaller.
So these are the core boolean operators you have. The exclamation mark operator is also important to highlight,
you saw it of course here with the equality checks, there we can combine it with the equal signs.
Now you can also use it on a value where you already know that it holds a boolean,
so on a variable where you know that it stores a boolean let's say to negate it,
so to check if that is not true.
This might sound a bit strange right now because you typically create booleans with the other operators
and if you wanted to negate it, you could just use the unequal operator but you will find cases
also throughout the course where you have some value which you derive as a boolean in some part of your
code and then in some other part of your code, you need that value again,
so which already is a boolean and you just want to then run code a if that was true or code b if it
was not true and then you can just use that exclamation mark
operator to do that. Now again, we'll see all of that in action in this course and in this module here
already,
this is just the overview
and with that overview out of the way, let's actually see a concrete example for how we write an if statement
and how we use some of these operators in there.