How to Comparison with the Equality Operator in JavaScript

Posted by

In JavaScript, the equality operator (==) is used to compare the value of two variables. It performs type coercion, meaning it converts the operands to the same type before comparison. For example, if you compare a string and a number with the equality operator, the string will be converted to a number before the comparison is made.

For example:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

var x = "5";
var y = 5;
console.log(x == y); // true

[/dm_code_snippet]

If you want to compare the value and type of two variables, you can use the strict equality operator (===). It does not perform type coercion and only returns true if the operands are of the same type and have the same value.

For example:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

var x = "5";
var y = 5;
console.log(x === y); // false

[/dm_code_snippet]

It’s important to note that if you use the == operator, JavaScript will try to convert the types of the variables before the comparison, which can lead to unexpected results. In general, it’s a good practice to use the strict equality operator === to ensure that the comparison is accurate.

In addition to the equality operator == and the strict equality operator ===, JavaScript also has the inequality operator != and the strict inequality operator !==. These operators work in the opposite way as their equality counterparts, returning true if the operands are not equal (or not strictly equal, in the case of !==).

Here are a few examples:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

console.log(3 != 4); // true
console.log("hello" != "world"); // true
console.log(5 !== "5"); // true

[/dm_code_snippet]

It’s also worth noting that when comparing objects or arrays in JavaScript, the equality operators (== and !=) compare the references to the objects or arrays, not their contents. This means that two separate arrays or objects that have the same contents will not be considered equal when compared with the equality operators. To compare the contents of two objects or arrays, you can use a loop and compare each element or property individually.

Here is an example:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

let obj1 = {a:1,b:2};
let obj2 = {a:1,b:2};
console.log(obj1 == obj2); // false

[/dm_code_snippet]

In conclusion, it is recommended to use === and !== as they are more strict and less prone to errors. But it also important to understand the behavior of == and != as well as the difference between reference and value comparison in JavaScript.