One thing we often do as a programmer in any programming language is equality checking. Whether this value equals that value or not.
Well, they are not too complicated to understand.
In this article, we’ll go over some differences and use cases such as where and how to use the two types of operators efficiently. And guess what? They are also funny to learn about.
But hold on. Before deep diving, I want you to take the below points into consideration.
- All the comparison operators return Boolean values after execution. Either true or false.
- And as we all know in programming, there are only two values 1 and 0. So if we go even further, true become 1 and false become 0.
Okay then, keeping that in mind, let’s get into this.
- Comparison with type
- Comparison with values
The double equals first converts the type of the operand and then compares them with values. While the triple equals compares the values without changing the type of the operand.
So, that’s it ? 😒
Hell no. There is more to come.
To check whether a value is true or false, we can use the Boolean object constructor. Here’s how 👇
console.log(Boolean('hey')) //true //-- any valid string is true console.log(Boolean(0)) //false //-- as I said earlier 1 is true and 0 is false console.log(Boolean('0')) //true //-- why 0 is true here ? Thanks to quotation, which makes it a String console.log(Boolean(' ')) //false //-- the quotation has no character: not a valid string; false console.log(Boolean([ ])) //true //-- empty array
console.log(false == 0) //true console.log(0 == '') //true console.log('' == false) //true
Double equal converts false and ‘ ‘ into 0, that’s why they are equal to 0.
But! This not gonna happen in the case of triple equal. Why? Because === does not convert the type of the operand.
console.log(false === 0) //false //-- false is Boolean while 0 is Number, so they not equal for === console.log(0 === '') //false //-- 0 is Number while '' is string console.log('' === false) //false //-- '' is String while false is Boolean
nullis a type of object, which mean noting; blank
undefinedis a data type itself
NaNis type of Number, which mean not a number
console.log(typeof null) // object console.log(typeof undefined ) // undefined console.log(typeof NaN) // Number
console.log(null == undefined) // true //-- double equal convert null into 0 and undefined as well console.log(null === undefined) // false //-- for triple equal null is an object while undefined is undefined
undefinedare only equal to each other and themselves while comparing with Double Equal ( == ). If you compare them with any other value you’ll get nothing but a
console.log(null == null) //true console.log(null == ' ') //false console.log(null == false) //false console.log(null == 000) //false console.log(null == 123) //false console.log(null == ) //false console.log(undefined == undefined ) //true console.log(undefined == ' ') //false console.log(undefined == false) //false console.log(undefined == 0) //false console.log(undefined == 1) //false console.log(undefined == ) //false
Are you kidding me ? No buddy, have a look 👇
console.log(NaN == null) //false console.log(NaN == 0) //false console.log(NaN == 135) //false console.log(NaN == 'NaN') //false console.log(NaN == 'hellow') //false console.log(NaN == 0) //false console.log(NaN == undefined) //false console.log(NaN == NaN) //false
So as you saw, one can easily get confused while choosing whether to use the == or ===.
Let me clarify this. Whenever you need to compare two values, always go with ===, because it gives expected results.
But do play around with both == and ===, because programming is fun, right?
Thanks for sticking around. Keep Learning.
This article is officially published on Within Bracket