Difference Between == & === in JavaScript

In JavaScript, comparison operators like == (double equals) and === (triple equals) are used to compare values, but they behave differently.

• The == operator is known as the loose equality operator. It compares two values for equality after performing type coercion, meaning it converts the values to the same type before comparing them.
• The === operator is called the strict equality operator. It checks for equality without type conversion, meaning both the value and the type must be exactly the same for the comparison to return true.

Differences Between == and ===

Here is the difference between == and === :

How Double Equals (==) Works in JavaScript

Here is how double equals works :

• Type Coercion: == compares values after converting them to a common type.
• Same Type: If the values are the same type, it compares them directly.
• Different Types: If the values are different types, JavaScript converts one or both to a common type before comparison.
• Special Cases: null and undefined are equal to each other but not to other values.

Now let's understand this with the help of example:

let s = "10"; // String
let n = 10;   // Number

console.log(s == n);

true

In this example

• "10" (string) is converted to 10 (number).
• The comparison becomes 10 == 10, which is true.

How Triple Equals (===) Works in JavaScript

Here is how triple equals works:

• Strict Comparison: The === (triple equals) operator checks both the value and type of the operands.
• No Type Coercion: Unlike ==, === does not perform type coercion. If the operands are of different types, the comparison will return false.
• Same Type and Value: For === to return true, both the value and the type must be exactly the same.
• Objects and Arrays: Objects and arrays are compared by reference, meaning they must point to the same instance in memory to be considered equal.

Let's understand this with the help of example:

console.log(5 === 5);        
console.log('5' === 5);      
console.log(true === 1);     
console.log(null === undefined); 

true
false
false
false

Best Practices for Using == and === in JavaScript

• Use === by default for strict comparisons (value and type must be the same).
• Avoid == unless you specifically need type coercion (e.g., comparing null and undefined).
• Be cautious with == when comparing values of different types (e.g., strings and numbers).
• Use === to prevent unexpected behavior from JavaScript’s automatic type conversion.
• Only use == when you understand how type coercion works and it's intentional.

Conclusion

In JavaScript, == performs type coercion and compares values after converting them to a common type, while === checks both value and type without coercion. It’s best to use === for more predictable and reliable comparisons. Use == only when type coercion is intentional and necessary.