Tech hands-on: double equals(==) and triple equals(===)

A closer look at the type coercion and strict comparison operators in JavaScript

If you've been working with JavaScript for a while, you've probably come across the comparison operators == and ===. These operators are used to compare two values in JavaScript, but they work differently. In this article, we'll take a closer look at these operators and explain the differences between them.

Double Equals (==)

The double equals operator (==) is a comparison operator in JavaScript. It compares two values and returns true if they are equal. However, the == the operator has some quirks that can make it tricky to use.

Type Coercion

One of the biggest issues with the double equals operator is that it performs type coercion. This means that if the two values being compared are of different types, JavaScript will try to convert one of the values to the other type before making the comparison.

For example, consider the following code:

0 == false; // true 
1 == true; // true 
null == undefined; // true

In each of these cases, JavaScript performs type coercion to convert one of the values to the other type before making the comparison. This can lead to unexpected results and bugs in your code.

Loose Comparison

Another issue with the double equals operator is that it performs a loose comparison. This means that it doesn't compare the types of the values being compared, only their values. This can lead to unexpected results when comparing values of different types.

For example, consider the following code:

"1" == 1; // true 
"" == 0; // true

In each of these cases, JavaScript performs a loose comparison and converts one of the values to the other type before making the comparison. This can lead to subtle bugs in your code that are difficult to track down.

Triple Equals (===)

The triple equals operator (===) is another comparison operator in JavaScript. It works the same way as the double equals operator, but with one important difference: it performs strict type checking.

Strict Comparison

When using the triple equals operator, JavaScript compares the types of the values being compared as well as their values. This means that two values are only considered equal if they have the same type and the same value.

For example, consider the following code:

"1" === 1; // false 
"" === 0; // false

In each of these cases, JavaScript performs strict type-checking and determines that the two values are not equal because they have different types.

Best Practices

When working with comparison operators in JavaScript, it's generally considered best practice to use the triple equals operator (===) instead of the double equals operator (==). This is because the triple-equals operator performs strict type-checking, which can help prevent subtle bugs in your code.

However, there may be cases where you need to use the double equals operator (e.g. when comparing values from different sources that may have different types). In these cases, it's important to be aware of the potential pitfalls and to test your code thoroughly to ensure that it's working as expected.

Conclusion

In summary, the double equals operator (==) and triple equals operator (===) are comparison operators in JavaScript, but they work differently. The double equals operator performs type coercion and loose comparison, while the triple equals operator performs strict type checking. Most of the time, the best way to avoid bugs and other problems in your code when working with comparison operators in JavaScript is to use the triple-equals operator.

Reasoning for the “Test your knowledge” question

The code displays nothing.

The code for(let c in nums) leads to the creation of the variable “c” and assigns the number as a string. The condition c === 1 does a strict comparison including type. Hence there won’t be any matched number that is equivalent to “c”