Introduction
In JavaScript, =, ==, and === are all operators used for different purposes. The difference between the first two operators (=, ==) is significant, making them easy to understand quickly. However, the difference between the next two operators ( == and === ) is significant enough to make them somewhat complex to understand. You might have doubts about when to use them, especially when starting an if/else condition in coding. Initially, you may lean towards == for simplicity, but as you advance, === is recommended for more precise comparisons.
Today, we will explore these operators in depth so that the next time you start coding, you can confidently choose which one to use and when. This article will save you a lot of time as a developer. Let's dive in!
What are ‘=’, ‘==’ and ‘===’ operators
= is an assignment operator in JavaScript used to assign values to a variable. As shown in the example below, the text is assigned to the variable using =, making it known as an assignment operator.
let string = 'This text has been assigned into the string variable';
== is an equality operator used in JavaScript to compare multiple values. It checks whether the values are equal or not and outputs a boolean value true or false. It is also known as a loosely typed equality operator because it doesn't care about the data types, it just checks if the value is the same or not and returns the result.
console.log(null == undefined); // true, both loosely considered "empty".
If you want a well-detailed explanation of the == operator, you should check out this article (JavaScript Loose Equality Operator). It provides examples for better understanding
=== is also an equality operator used for the same purpose as ==. It checks both the value and the data type of the operands and returns a boolean value. This is known as the strict equality operator. It first checks if the data types are the same for the values being compared; if they are not, it immediately returns false without further comparison. If the data types are the same, it then compares the values. This operator is widely used in coding for its precise comparison and accurate output.
console.log(null === undefined); // false, because types differ.
If you want a well-detailed explanation of the === operator, you should check out this article (JavaScript Strict Equality Operator). It provides examples for better understanding
Since we have seen what these operators are and what the difference between them is, now we will see when we should use them.
When to use them?
The = operator is only used for assigning values, we can't use it for any other purpose. It is used extensively in JavaScript and is straightforward. Now, we are left with the next two operators, == and ===. Let's discuss them for better understanding.
As mentioned earlier, == does not consider data types, whereas === considers data types when checking values. Therefore, it is clear that we should use === when we need to compare values along with their data types. If we don't need to compare data types, then we can use ==. Sometimes in coding, we only need to compare values, so using == saves us from the extra step of matching data types for the starting equality operands to find out the comparison between them. However, the recommended approach is to use === for accurate results.
console.log(null == undefined); // true, both loosely considered "empty".
console.log(null === undefined); // false, because types differ.