JavaScript - == and ===

1. ==

Equality(==) - MDN

The equality operator's camparison can be roughly summarized as follows:

• If the operands are both objects, return true only if both operands reference the same object.

let a = { food: "pork", fruit: "watermelon" }; let b = a; console.log(a == b); //true let c = { ...a }; //or other object-copy operations console.log(a == c); //false 

• If one operand is null and the other is undefined, return true.

console.log(undefined == null); //true console.log(null == undefined); //true 

• If the operands have the same type, they are compared as follows:

  • String: return true only if both operands have the same characters in the same order.

  console.log("abcd" == "abcd"); //true console.log("abcd" == "abcde"); //false 

  • Number: return true only if both operands have the same value. +0 and -0 are treated as the same value. If either operand is NaN, return false.

  console.log(1 == 1); //true console.log(1 == 2); //false console.log(+0 == -0); //true console.log(NaN == NaN); //false 

  • Boolean: return true only if operands are both true or both false.

• If the operands are of different types, try to convert them to the same type before comparing:

  • When comparing a number to a string, try to convert the string to a numeric value.

  console.log(1 == "1"); //true 

  • If one of the operands is a boolean, convert the boolean operand to 1 if it is true and 0 if it is false.

  console.log(true == 1); //true console.log(false == 0); //true console.log(0 == !!null); // true. !null is true, !true is false, false is 0 console.log(0 == !!undefined); // true. !undefined is true, !true is false, false is 0 

  • If one of the operands is an object and the other is a number or a string, try to convert the object to a primitive using the object's valueOf() and toString() methods.
  • Object.prototype.valueOf(): Returns the primitive value of the specified object(objects of type string, number, bigint, boolean, symbol). If the object has no primitive value(objects of type object), it returns the object itself.

   // objects of type string, number, bigint, boolean, symbol let a = 1; console.log(a.valueOf()); // 1 // objects of type object let b = { name: "Kitty" }; console.log(b.valueOf()); // { name: 'Kitty' } 

  • Object.prototype.toString(): Returns a string representing the object(objects of type string, number, bigint, boolean, symbol). If the object has no primitive value(objects of type object), it returns [object Type].

   // objects of type string, number, bigint, boolean, symbol let a = 1; console.log(a.toString()); // "1" // objects of type object let b = { name: "Kitty" }; console.log(b.toString()); // [object Object] 

  • Array.prototype.toString(): Array object overrides Object's method toString(). It returns a string representing the elements of the array.

   let arr = ["kitty"]; console.log(arr.toString()); // 'kitty' 

// object == string let obj = { name: "kitty" }; console.log(obj == "kitty"); //false. obj.valueOf(): { name: "kitty" }, obj.toString(): [object Object] // array == string let arr = ["kitty"]; console.log(arr == "kitty"); //true. arr.valueOf(): ['kitty'], arr.toString(): 'kitty' 

2. ===

Strict equality(===) - MDN

Unlike the equality operator, the strict equality operator always considers operands of different types to be different.

• If the operands are of different types, return false.

consol.log("3" === 3); //false console.log(true === 1); //false console.log(null === undefined); //false 

• If both operands are objects, return true only if they refer to the same object.

let obj1 = { name: "kitty", age: 1 }; let obj2 = obj1; console.log(obj1 === obj2); let obj3 = { name: "kitty", age: 1 }; console.log(obj1 === obj3); let obj4 = { ...obj1 }; console.log(obj1 === obj4); 

• If both operands are null or both operands are undefined, return true.

console.log(null === null); // true console.log(undefined === undefined); // true 

• If either operand is NaN, return false.

console.log(NaN === NaN); // false 

• Otherwise, compare the two operand's values:

  • Numbers must have the same numeric values. +0 and -0 are considered to be the same value.

  console.log(+0 === -0); //true console.log(1 === 1); //true console.log(0 === 1); //false 

  • Strings must have the same characters in the same order.

  console.log("kitty" === "kitty"); //true console.log("kitty" === "kity"); //false 

  • Booleans must be both true or both false.

The most notable difference between == and === is that if the operands are of different types, the == operator attempts to convert them to the same type before comparing.