The Typescript has two operators for checking equality. One is == (equality operator or loose equality operator) and the other one is === (strict equality operator). Both of these operators check the value of operands for equality. But, the difference between == & === is that the == does a type conversion before checking for equality. Similarly, we have two, not equal operators != and !==
Table of Contents
Checking Equality
Two values are equal if they are
- identical strings
- numerically equivalent numbers
- identical Boolean values
- the same object (reference types)
Example:
1 2 3 4 5 6 7 | let a=10 let b=10 console.log(a==b) //true console.log(a===b) //true |
Both == & === returns true in the above example, becuase the types of both operand are same.
Difference between == & ===
If types are same then there is no difference between == & ===
If types are different then
== does a type conversion. It will attempt to convert them to a string, number, or boolean. before doing the comparison.
=== returns false.
Equality Operator ==
Equality Operator does not check the type of the operand. It tries to convert them to string, number, or Boolean.
In the following example, both the operands are numbers. Hence the equality operator returns true.
1 2 3 4 5 6 7 | let a=10 let b=10 console.log(a==b) //true |
But, in the following code, the variable b is a string and not a number. The Typescript makes the type conversion of b from string to number and then does the comparison. Hence the result is true again.
1 2 3 4 5 6 7 | let a=10 let b="10" console.log(a==b) //true |
The following code also returns true.
1 2 3 4 5 6 7 8 | let a="01" let b=1 console.log(a==b); //true |
Strict Equality Operator ===
The strict Equality operator, returns false if the types are different.
For Example, the following code returns true because both value & type of variables are same.
1 2 3 4 5 6 7 | let a=10 let b=10 console.log(a===b) //true |
While the following example, returns false, because the variable b is of type string
1 2 3 4 5 6 | let a=10 let b="10" console.log(a===b) //false |
Notes on Equality check
NaN is not equal to anything including itself.
1 2 3 | console.log(NaN==NaN); //false |
Negative zero equals positive zero.
1 2 3 | console.log(-0==0); //true |
null equals both null and undefined.
1 2 3 4 5 6 7 8 | console.log(null==null); //true console.log(null==undefined); //true console.log(undefined==undefined); //true console.log(Infinity==Infinity); //true |
!= and !== Not Equal
!= & !== operators check the un equality of two operands. They return true if the operands are not equal else false. != is similar to == & !== is similar to === in their comparisons. Like ==, != also, coerce the values before comparing the operands.
Example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | // != Operator let x=10 let y=10 console.log(x!=y) //false console.log(x!==y) //false // !== Operator let a=10 let b="10" console.log(a!=b) //false console.log(a!==b) //true |
Equality check on Reference Types
The objects are considered equal only if are same object.
In the example, a1 & b1 are different objects hence are not equal although they have the same values
1 2 3 4 5 6 7 8 9 10 11 12 13 | let a1 = [10,20] let b1 = [10,20] console.log(a1==b1) //false console.log(a1===b1) //false let c1=a1 //same object console.log(a1===c1) //true console.log(a1==c1) //true |
== Vs ===. Which one to use ?
Always use === as it does not attempt to coerce the values.
== does a type coercion, the result of which is not predictable as shown in the followng examples.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | '' == '0' // false 0 == '' // true 0 == '0' // true false == 'false' // false false == '0' // true false == undefined // false false == null // false null == undefined // true ' \t\r\n ' == 0 // true |
Reference
Read More
- Complete Typescript Tutorial
- Typescript Operators
- Arithmetic Operators
- Unary plus / Unary minus Operators
- Increment/Decrement Operators
- Comparison / Relational Operators
- Equality Operator / Strict Equality Operators
- Ternary Conditional Operators
- Logical Operators
- Bitwise Operators
- Assignment Operators
- Nullish coalescing operator
- Comma Operator in Typescript
- Operator Precedence
The title is quite confusing. Specially for those who don’t bother reading the content
Not only confusing, just straight up incorrect. It should be the other way around.