This post would be most interesting for javascript lovers. Actually javascript behaves
different than other language. We don't have any static data types in javascript which makes javascript a flexible language. In Javascript we can pass anything to function,
assign anything to variable. Isn't it interesting ?
Let's come to the topic of the post. We will discuss how comparison of values is performed in javascript which differs from other programming language. This is most asked questions in javascript interviews.
For ex :-
1) '3' === 3
Output: false
First operand has 3 value and type is string whereas second operand has 3 value and type
is javascript.
So types differs in both operands hence false
2) NaN === undefined
Output: false
First operand has NaN which has type number and second operator has type undefined.
Straightaway types unequals so false.
3) For Object comparison both == & === compares the reference of Object.
1) const a = {}; const b = {};
Condition : a === b
Output : false
2) const a = { a: 10, b: 30 } and b === { a: 10, b: 30 } Condition : a === b
Output : false
3) const a = {}, b = a, c = a
Condition : b === a
Output : true
You need to understand javascript has two reference type variable Array and Object.
Whenever comparison is performed for two reference type variables it compares references / addresses where the object / array is stored.
Suppose address of variable a is 90893 where some object is stored, now it is assigned to
b & c. So address of all variables is same hence it will return true in either case.
Can you guess output of :-
1) {} == {} and {} === {}
In both cases it returns false because when we use object literal {} it allocates some
memory in the storage for this. So in either case we have different addresses for
comparison. Hence it will return false.
Same is for [ ] == [ ] and [ ] === [ ], [ 1, 2 ] === [1, 2 ], in either case
it will return false. Same logic of object comparison will be applied here.
Note : This is common asked question in javascript interview.
Now comes to comparison in which one of the operand is primitive and using == for
comparison. This would be quite interesting for you if you don't know how comparison is
performed by javascript using Abstract Equality Algorithm.
Note : "===" checks for both type and value whereas "==" checks for values only.
Let's compare two values :-
1) "2" == 2, In this comparison you can see both operands have different types.
First operand is string while other is number. So how this algorithm compares.
This algorithm basically does some type conversion when we have different types.
But first let's focus on when both types are same.
1) undefined == undefined
It will return true as per Abstract Equality Theorem.
2) 4 == 4
It will return true as per Abstract Equality Theorem.
3) "abc" == "abc"
It will return true as per Abstract Equality Theorem.
4) null == null
It will return true as per Abstract Equality Theorem.
5) NaN == NaN
It will return false as per Abstract Equality Theorem.
6) true == true
It will return true as per Abstract Equality Theorem.
7) false == false
It will return true as per Abstract Equality Theorem.
9) {} == {}
It will return false. As we already discussed above.
10) [ ] == [ ]
It will return false. As we already discussed above.
11) "abc" == "acb"
It will return false as in string comparison we must have equal length string and same
sequence of characters in both strings.
Other than this, if we have different values for same type primitives it will always
return false. Like :-
3 == 4, return false
Okay, I think you must have good knowledge what is the result when we same types. Let's discuss when we have different types and using "==" for comparison of values.
When we have different types and using "==" for comparison, javascript uses type conversion in some cases in one of the operand.
1) null == undefined
It will return true as per Abstract Equality Theorem.
2) undefined == null
It will return true as per Abstract Equality Theorem.
3) 4 == "4"
Here one operand is number and another one is string. So javascript does type conversion
for the string operand into number. So what exactly looks like while comparing the values ?
=> 4 == Number("4") => 4 == 4 => true
4) "4" == 4
Output: true, exactly same logic will be applied here as above.
5) 0 == false
Here one operand is number and other is boolean. So in this case also we do type
conversion and converts boolean into number.
=> 0 == Number(false) => 0 == 0 => true
Note: Numeric value of false is 0 and 1 is true.
6) false == 0
Interchanging the positions of operand won't affect result. It will be same result.
In this case also it will output is true
7) new Boolean() == false
Now comes on when one of the operand is object and other is primitive. How comparison will take place ?
When we have such scenario javascript auto unboxing the object value by using toString or
valueOf function whichever compares true value otherwise false.
In this case, we have new Boolean(), primitive value of new Boolean() object is false
as default value using valueOf function.
So comparison will looks like this :-
=> toPrimitive(new Boolean()) == false
So javascript uses both functions for comparison with primitives.
=> (new Boolean()).toString() returns "false"
=> (new Boolean()).valueOf() returns false
So by using valueOf operator :-
(new Boolean()).valueOf() == false, will execute true.
(new Boolean()).toString() == "false", will also execute true. So both new Boolean() == false and new Boolean() == "false" are true statements.
Isn 't it quite interesting we come to know how primitives compares against objects.
Let's come on next comparison :-
{} == false
Now first operand is object let's see how object literal converts itself into primitive
value.
By using valueOf() :-
({}).valueOf() will return {}, which is object literal itself so javascript can't
use this valueOf operator for comparison of value.
By using toString() :-
({}).toString() will return "[object Object]" this is string value which is primitive
so javascript use this value for comparison.
So ({} == false), it will return false because using object conversion for {}. we either getting {} using valueOf function and "[object Object]" using toString function. This statement ({} == "[object Object]"), it will execute true.
So friends this is it ! I hope you understood the concept behind every comparison of
values / primitives / object / null comparison.
This is mostly asked interview question in javascript please be prepare with this.
Please go through again if you don't understand the concepts it is utmost important for
you. If you still indulge in any sort of confusion / doubts,
please put in the comment section.
0 Comments