Contents
Why Does Not Equal Does Not Equal in JavaScript?
We all know that the == operator in JavaScript compares two values for equality. But what many don’t realize is that it actually performs a type conversion on the operands before doing the comparison. This can lead to some unexpected results, as we’ll see.
Checkout this video:
The Difference between == and === in JavaScript
== and === are both comparison operators in JavaScript, but they are used for different purposes. == produces true if the two operands are equal in value, while === produces true if the two operands have the same value and are of the same type. In this article, we’ll take a closer look at the differences between == and === in JavaScript.
== (Equal)
The == (Equal) operator is used to compare two values or variables, and return true if they are the same, and false if they are not.
The == operator will compare for equality after doing any necessary type conversions. If the two operands are not of the same type, JavaScript will convert one or both of them to an appropriate type before making the comparison.
So, == does type conversion before comparing.
##== Comparison Examples
1 == 1 // true
1 == ‘1’ // true
0 == false // true
1 == true // false
## === (Strict Equal)
The === (Strict Equal) operator is used to compare two values or variables, and return true if they are the same, and false if they are not.
The === operator will not do any type conversion before making the comparison. If the two operands are not of the same type, then === will simply return false. So === is more strict than == .
## === Comparison Examples:
1 === 1 // true
1 === ‘1’ // false
0 === false //false
=== (Strictly equal)
In JavaScript, == (double equals) and === (triple equals) are different ways of testing for equality.
== only looks at the value, not the type, so it would consider these two values equal:
1 == ‘1’ //true
=== also looks at the type, so it would consider these two values not equal:
1 === ‘1’ //false
Why Does Not Equal Does Not Equal in JavaScript?
In JavaScript, != is the not equal operator. It compares two values and returns true if the values are not equal. == is the equality operator. It compares two values and returns true if the values are equal.
The Abstract Equality Comparison Algorithm
JavaScript has both strict and type–converting equality comparison. Three different equal signs compare values for equality as follows:
-== The == operator performs an abstract comparison between two values.
-=== The === operator performs a strict comparison between two values.
-Object.is() The Object.is() method performs a sameValueZero comparison between two values.
The == operator checks for value equality with coercion allowed, while the === operator checks for value equality without allowing coercion; the Object.is() method considers two values equal if and only if they have the same value and are of the same type. Specifically, Object.is() evaluates to true if and only if at least one of the following holds:
-Both x and y are undefined.
-Both x and y are null .
-Both x and y refer to the same object . This is equivalent to x === y , except that NaN is considered equal to itself, unlike === . -Both x and y are Boolean, Number, or String objects (or their primitive counterparts) whose contents match exactly . If both objects have equivalent contents but different types (e.g., new Boolean(false) == false ), false is returned instead of true . Note that this case also covers objects created with new Number(5) == 5 , since primitive Number values derive from Number objects in that context.[2] If both arguments are BigInts , they are considered equal if they have the same BigInt value.[3] -If neither of the above cases hold true, then x and y are considered equal if they have the same type tag (rincluding “object” , “bigint” et al.):[4][5]
1) “undefined” , “boolean” et al.: x and y must have exactly the same bit pattern.[4][6][7]
2) “object” :”[object Object]” : If both arguments refer to exactly the same object,[8] then Object.is() returns true ; otherwise it returns false .
3) “[Symbol]” : Symbols always compare unequally.[9][10]
4) Any other tag: Values with different tags will not be considered equal by Object.is() unless they happen to also be strictly equal according to pairwise comparisons.[11] For example, although 1n !== 2n in general,[12] Object(1n) !== Object(2n), so false is returned by Object.is(). However, since +0 === -0,[13] while 0n === 0n,[14] calling Object(*0) would return either false or true depending on whether -0 was internally treated as 0 or differentiated from +0 by its bigint tag; similarly with NaN vs 0.[15][16].
The Strict Equality Comparison Algorithm
In JavaScript, there are two equal comparison operators: == and ===. == does what’s called “loose equality comparisons” and === does what’s called “strict equality comparisons”. In order to understand the difference between the two, we must first understand how JavaScript comparison operators work.
The Strict Equality Comparison Algorithm
A comparison x === y, where x and y are values of any type, produces true or false. Such a comparison is performed as follows:
1. If Type(x) is different from Type(y), return false.
2. If Type(x) is Number, then
a. If x is NaN, return false.
b. If y is NaN, return false.
c. If x and y represent the same number value, return true.
d. If x represent +0 and y represent -0, return true..
e. Return false;
3 4 Otherwise if Type(x) is String or Boolean, then return true if x and y represent the same string or boolean value; otherwise return false..
5 Otherwise if Type(x) is Null or Undefined, then return true if both x and y are null or both are undefined; otherwise return false..
6 Otherwise Object(x) !== Object(x).
7 Return SameValueNonNumber (x,y).
Examples
In JavaScript, the == and === operators are used for comparing values. The == operator checks for equality only, while the === operator checks for both equality and type. So why does === not equal === in JavaScript? The answer has to do with type conversion.
Example 1
In mathematics, the idea of equality is pretty straightforward: if two things are equal, then they are interchangeable. So if A = B, then B can be used in place of A without changing the meaning or value of the expression.
But in JavaScript, equality is a little more complicated than that. There are actually two different types of equality operators: the double equals operator (==) and the triple equals operator (===). And as you might have guessed, they behave differently.
The == operator will compare two values and try to convert them to the same type before doing the comparison. So, for example, if you have two values like this:
var a = 1;
var b = “1”;
the == operator will treat them as equal because it will convert the string “1” to a number before it does the comparison. That means that, in JavaScript,== can give some unexpected results:
0 == false // true because 0 converts to false
“” == false // true because “” converts to 0 which converts to false
null == undefined // true because null converts to undefined
But there’s another way to compare values in JavaScript: with the === operator. The === operator behaves differently than ==; it does not try to convert types before it compares them. So if you have two values that are not the same type (like a number and a string),=== will always return false:
0 === false //false because they are different types
“” === false //false because they are different types
null === undefined // also false
Example 2
In this example, we have a simple boolean expression that uses the not operator (!) to flip the value of the boolean value “b”. The result is that “a” is now equal to false, and “b” is now equal to true.
Example 3
false == 0 // true
false === 0 // false