CODEWITHSUNDEEP
javascriptoperators
chris
chris

Reputation: 36937

Javascript if-else operators why does whats the difference in checking for not equal

Ok, I have been on so many pages, and I have used all of the above methods of finding not equal to. However what is peaking my interest currently and has been for a while I guess. Is what is the difference between the following examples, and why does it appear that sometimes only one variation will work over the other in different scenarios, I have been trying to find a solid answer, but its not that easy of a search I suppose.

Anyway In many cases I have had to do something like, because it seems like nothing else will work.

if(str == bad_condition)
{
  //ignore
}
else
{
   //code to do something
}

Many other times I am doing any one of the following

if(!str == bad_condition)
{
   //code to do something
}

or

if(str != bad_condition)
{
   //code to do something
}

or

if(str !== bad_condition)
{
   //code to do something
}

Now I suppose the ultimate question here, is why do any of the last 3 seem to only work for certain things? Is there a time and place I should either one of them over the other? or is it just some random luck of the draw on my part as I am usually having to deal with someone else's original code base. I'm just curious overall, and Im not trying to spark a debate. I'd just like to seriously know if there is a major difference in the uses of any of the above, and if there is what and why or how.

Upvotes: 1

Views: 147

Answers (7)

T.J. Crowder
T.J. Crowder

Reputation: 1074148

Those last three are not the same as one another, and you almost certainly don't want to use the first of them. Let's break them down:

if(!str == bad_condition)
{
   //code to do something
}

Don't do that. What happens there is first, the !str is evaluated, and then the result of that is compared to bad_condition. The result of !str will be either true or false. (It'll be true if str is "", 0, null, undefined, or NaN; false otherwise.) So unless bad_condition is true or false, you don't want to compare !str to it, and if bad_condition is true or false, there's usually a better way to write the expression.

if(str != bad_condition)
{
   //code to do something
}

This compares str to bad_condition using "loose" equality. Loose equality is tricky and the rules for it are complex. "0" == 0 is true, for instance, as are "" == 0 and "0" == false; "false" == false is false. If you know that both str and bad_condition are the same type, it's fine, but if you don't, you get into type coercion stuff.

if(str !== bad_condition)
{
   //code to do something
}

This compares str to bad_condition using strict equality. That means no type coercion is done, if str and bad_condition are not the same type, the condition will always be false.

Upvotes: 3

gulty
gulty

Reputation: 1076

I guess the first one is clear. str == true is a condition which simply checks if str equals true. In this case true could also be a string. The 2nd is the negation. That means for example:

    var str = true;
    if (str == true) <---- true, cause true == true;
    if (!str == true) <---- false because !str is false and false == true is false;

The 3rd means not equal to, meaning:

    var str = true;
    if (str != true) <- gives us false because true not equal true is false because it actually is equal.

The last one is nearly the same as the 3rd. You use === or !== if you want to compare the value AND the type of the variable. This means if u have

    var str = false;
    if (str === false) <- true, same value and same type (boolean).

But:

    var str = "false";
    if (str === false) <- false

because its the same value but the variable contains a string, not a boolean which is requested by the condition. if the condition would look like: 

    if (str === "false") it would be true again

because the same value + the same type.

hope it helps

Upvotes: 1

David M&#252;ller
David M&#252;ller

Reputation: 5351

!= and == go together, they just check for equality not caring for the data type, so the following will happen:

console.log([] == ""); //true

That's because the string value of [] evaluates to false ([].toString()) - just like the empty string does. (Thanks for Alnitak pointing this out in his comment!)

On the other side !== and === go together checking for 2 values being identical, so the previous example will evaluate to false. See here for the "Falsies".

console.log([] === ""); //false

The !value just negates a variable, so makes expressions that evaluate to boolean true false and the other way round.

Upvotes: 2

Sirko
Sirko

Reputation: 74036

You are doing fundamentally different things here every time!

str == bad_condition

This compares both operands, but does type coercion. So if one operand is a number or string, the other might be converted, which can yield some confusing results.

!str == bad_condition

Here you are doing some type conversion by hand. The ! operator makes a boolean out of its operand according to some rules.

str != bad_condition

This checks for inequality, but with the same coercion rules as ==.

str !== bad_condition

Here you check first the types of both operands (no type coercion happens!). If both are of the same type, their contents are checked.

So as you see, in every case you compare different stuff. Depending on your specific need I would advise you to use === and !== as those are the most straight forward comparisons with no type coercions.

Be reminded that JavaScript will compare objects not by contents, but by object references. So [] === [] yield false, because you create to objects, which do not share the same reference!

As a hint for type coercions take this from MDN:

Equal (==)

If the two operands are not of the same type, JavaScript converts the operands then applies strict comparison. If either operand is a number or a boolean, the operands are converted to numbers if possible; else if either operand is a string, the other operand is converted to a string if possible. If both operands are objects, then JavaScript compares internal references which are equal when operands refer to the same object in memory.

Upvotes: 0

Kevin Bowersox
Kevin Bowersox

Reputation: 94429

if(str == bad_condition)

This condition checks if str is equal to bad_condition, it does not check for equivalence, meaning the type of variable is not taken into consideration 1 will be considered the same as "1", returning true.

if(!str == bad_condition)

This is simply a negation of the previous if statement, it checks to see if str is not equal to bad_condition. It can also be written as if(str != bad_condition)

if(str !== bad_condition)

This condition is checking equivalence, meaning it compares type and value, the expression is also negated. So the following hold true:

str = 1, bad_condition = 2 returns true due to negation

str = 1, bad_condition = "1" returns true, values are the same, however type is different

str = 1, bad_condition = 1 returns false since both type and value are the same.

Upvotes: 0

andy
andy

Reputation: 550

In addition to the above answer, you also need to know about 'undefined', 'null' and false and how these can give 'seemingly inconsistent' results in a comparison.

This article seems interesting: http://www.mapbender.org/JavaScript_pitfalls:_null,_false,_undefined,_NaN

Upvotes: 0

Magus
Magus

Reputation: 15104

The difference between != and !== is the type checking. For example :

true != 0; // true
false != null; // false
false !== null; // true
false != 0; //false
false !== 0; // true

But !str == bad_condition is weird. I think you want to say !(str == bad_condition). But !str is a valid value. !"test" is false and !"" is true.

Upvotes: 0

Related Questions