Introducing Comparison Operators in JavaScript
Codecupdev
Posted on May 1, 2022
JavaScript provides us with a set of operators called comparison operators. Comparison operators let us compare values and return a boolean (true or false).
If you would like to watch a video of this post you can view it here:
The first set of these operators we will look at are:
- Greater than: Checks if a value is greater than something.
- Less than: Checks if a value is less than something.
- Greater than or equal: Checks if a value is greater than or it is equal to something.
- Less than or equal: Checks if the value is less than or it is equal to something.
If we were making a program that was based on supermarket stock we might encounter a situation where we only want the user to be able to place an order if we had bananas in stock. To do this we would want to check that the number of bananas available was greater than 0, this would be an example of using the greater than operator.
Later we may then want to limit the amount of bananas a customer is able to order in one go to 5 to ensure the order system was fair. In this case, we would want to check that the order count of bananas was less than or equal to 5 and we would use the less than or equal to operator.
We will start with a simple example of using the greater than operator. We will check if one is less than 2 and we get true.
1 < 2
// ---> Returns true
Now we move on and check whether one is greater than two and we get false.
1 > 2
// ---> Returns false
Now let’s do an example with the less than or equal operator. We will check if 5 is less than or it is equal to 5, we get true.
5 <= 5
// ---> Returns true
The next set of comparison operators let us check whether a value is equal to another value and return a boolean based on whether or not this is the case. These operators consist of the following:
- Equality operator (sometimes called loose equality)
- Inequality operator(sometimes called loose inequality)
- Strict equality
- Strict inequality
In JavaScript, we have what is called loose equality and also strict equality. When we use the loose equality operator, Javascript performs what is called type coercion.
Type coercion is the automatic conversion of one data type to another data type. So if we wanted to compare the integer zero to a string containing zero the comparison using loose equality would return true. This is because the string zero will be coerced to the integer type and then the comparison performed would be the number 0 compared with number 0. On the other hand, if we performed the same comparison using the strict equality operator the return value would be false because the strict equality operator does not perform any type coercion.
So let’s start by trying out the equality operator. We will compare the integer five with the string 5. As you can see we get true because the string five is coerced to the integer type before the comparison is performed.
5 == '5'
// ---> Returns true
Now let’s try this again but compare the integer 5 to the string 6. These are not equal so we get false.
5 == '6'
// ---> Returns false
If we did this again and use the inequality operator we get true because the inequality operator checks to see that the values are not equal to one another.
6 != '6'
// ---> Returns true
Lastly, we will look at the strict equality operator. We will compare the integer ten to the integer ten. These values are both the same so we get true.
10 === 10
// ---> Returns true
Let’s try changing this a bit and compare the integer ten to the string ten. Now we get false and this is because we are using the strict equality operator and therefore this time the string will not be coerced.
10 === '10'
// ---> Returns false
However, if we check that these values are not equal using the strict inequality operator we will get true because they are not from the same data type.
10 !== '10'
// ---> Returns true
Please feel free to post any comments, questions, or feedback!
Posted on May 1, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
August 17, 2023