简体   繁体   中英

Javascript: Which way is better to check conditional statement?

In javascript, which will be better way to check conditional statement in terms of performance, robustness and which is the best practice?

var x = null;
// this condition is checked frequently and x will be set to null or some value accordingly
if(x !== null){...}
 OR
if(!!x){...}

You could just do

if (x) { ... }

Simply says, if x is a truthy value.

As Nina pointed out. I would always add some extra validation, depending on what I'm expecting.

if (x && x > 0) { ... }

Or

if (x && x instanceof Array)

But I'm always checking x has some sort of value and isn't undefined or null

It's never necessary to write if(!!x){...} . That is exactly the same thing as writing if(x){...} . Using the ! operator twice converts a value to a boolean that reflects whether it is "truthy" or not. But the if statement does that anyway: it tests whether the value you provide is "truthy". So whether you use !! or not it will do the same thing.

if(x !== null){...} is something else entirely. It doesn't just check whether x is "truthy", it specifically compares the value of x with null . For example, if x has the numeric value 0 , if(x){...} or if(!!x){...} will not execute the ... code, because 0 is a "falsy" value, but if(x!==null) will execute the ... code, because 0 is not the same value as null .

A related example is if(x!=null){...} or if(x==null){...} . (Note the use of != or == instead of !== or === .) This is a bit of a special case in JavaScript. When you compare against null using the != or == operator, it actually compares against either null or undefined and treats those two values the same. In other words, if x is either null or undefined , then if(x==null){...} will execute the ... code, but if(x!=null){...} will not execute the ... code.

It's generally recommended to avoid the == and != operators and use the strict comparison === or !== instead, but treating null and undefined the same can be useful in some situations, so this is a case where the non-strict operators are helpful.

In any case, the real question to ask is what is the purpose of your code, and what specifically do you need to test for here?

Assuming you need to check for a value which is strict inequality !== to null

this condition is checked frequently and x will be set to null or some value accordingly

if (x !== null) { /* */ }

Then you can only use the above comparison. Any other comparison would return a wrong result.

For example

 var x = 0; if (x !== null) { // true console.log(x + ' !== null'); } if (x) { // false console.log(x); } // some more checks console.log(undefined !== null); // true console.log(undefined != null); // false 

Edit: My response was quite wrong which I learned after my conversation with Nina Scholz in her own response to this thread. I updated accordingly.

There are many ways to check values depending on the type you expect to use. Therefore the problem is not so much about performance as it is with correct evaluation. Starting with your examples:

if(x != null)

This will evaluate to false if the value of x is either null or `undefined'.

The next case:

if(!!x)

This is an entirely different operation. It casts the value of x as a boolean, and in most cases if(x) will work the same way. But now, if the value is falsy, like 0, the empty string, the expression returns false . So, if expecting a number, you should check for the zero value:

if(x || (0 === x))

Bear in mind that if x were anything other than an int, the expression returns true.

And the case where you expect a string:

if(x || ('' === x))

Same thing here, if x was, say 12, the expression returns true.

I could go on with lots of examples. Unfortunately there are certain expressions that work in unexpected ways. For instance, it should be easy to check if a value is a number by calling isNaN(number), but if the value is an empty string or a representation of an array index (' 2 '), isNaN returns false.

I recommend you to check this table with all the type conversions so that you become more aware on how to check the validity of a value.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM