obj == 'undefined' OR obj === 'undefined' OR obj == null OR ALL

Question

I am always unsure about which one is correct and which ones to use.

Usually I do (obj == null) check. I thought its better to just ask.

Which one of the following shall I use:

  if (obj == null) {
        alert('obj is null');
  }

OR

  if (obj == null || obj == 'undefined') {
        alert('obj is null or undefined');
  }

OR

  if (obj == null || obj == undefined) {
        alert('obj is null or undefined');
  }

OR

  if (obj == null || obj === 'undefined') {
        alert('obj is null or undefined');
  }

Which one is better and do we really need to check for undefined?

Answer 1

Just do

if (obj == null) {

That'll check for both null and undefined.

---

To the confused downvoters, using the == null will simultaneously check for null and undefined, but no other "falsey" values.

The typeof foo === "undefined" syntax actually causes more bugs than it fixes. Like these...

typeof foo === undefined     // common bug

foo === "undefined"          // common bug

typeof foo === "undefnied"   // common bug

These are very common bugs, and are reasons to not use this syntax.

---

Here are the cases for which beginners are told to use that syntax...

• undefined may have been redefined

• your variable may be undeclared, causing a ReferenceError

---

Here are the reasons that those aren't very good reasons

• the global undefined can not be redefined in modern browsers, so it's a non-issue. And even if it does get redefined, then something is terribly wrong, and needs to be fixed either way. If you hide the issue, you'll never be able to fix it.

• If a developer is trying to use an undeclared local variable, that means there's a bug in the code, and the ReferenceError should be seen as a desirable warning, not as something to be hidden.

• If a developer is trying to use an undeclared global variable that can't be known before hand, it's safer to check for the variable as a property on the window object than to use the unsafe typeof foo === "undefined" syntax.

---

And yes, there is a type distinction between null and undefined, so both need to be checked. The == operator performs a type coercive algorithm when the types don't match. That's why you can use == null to check for both.

Answer 2

You've identified four tests:

if (obj == null)
if (obj == null || obj == 'undefined')
if (obj == null || obj == undefined)
if (obj == null || obj === 'undefined')

Of these, the first and third behave identically. (obj == null will evaluate to true if obj is undefined.)^* The second and fourth do not do what you want at all, because the test will succeed if obj is the string 'undefined' (as well as when obj is undefined, thanks to how obj == null behaves).

As to whether you need to test for undefined, that depends on whether you need to distinguish between undefined values and null values. In most applications, you do not need to do that. If you do need to do that, you should be using obj === null and obj === undefined.

If you need to safeguard against undeclared variables, then you can use:

if (typeof obj === 'undefined')

but in all but the most unusual situations, you should know in a given context whether a variable has been declared.

^*_{However, obj === null will evaluate to false if obj is undefined.}

Answer 3

undefined is a word that means not defined.

null is an object

Let see this code

function saySomething(thing) {
    if(thing === undefined) {
        sayRandomThing();
    }else {
        sayThat(thing);
    }
}

In this case I would check if the argument is given or not or, in other words, if the argument is defined or not.

Note that the variable name thing is declared, but it's not defined. So in this case thing === undefined is enough and you don't need to do more verbose typeof thing === "undefined".

There is no reason to use the word null. Because null is an object and it have nothing to do with our thing.

Just another note. typeof thing === "undefined" is needed when effectly you don't know if the variable is declared. But, as documentation say:

However, this kind of technique should be avoided. JavaScript is a statically scoped language, so knowing if a variable is defined can be read by seeing whether it is defined in an enclosing context. The only exception is the global scope, but the global scope is bound to the global object, so checking the existence of a variable in the global context can be done by checking the existence of a property on the global object (using the in operator, for instance)

When should I use null?

From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/null

In APIs, null is often retrieved in place where an object can be expected but no object is relevant.

null is an object. Javascript core use null when a function should returns an object or an array, but in some case should tell us an "object not found" (different case of an empty object {} that means: I've found the object, it's empty). It's the case of method match for example.

var matches = "My awesome string".match("don't match anything");

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

In your script, you know, as developer, what type should be the variable. And you should know which condition you should use. Remembering:

• If you don't know if the variable is declared or not, use if(typeof varName === "undefined") before other checks.
• If you don't know if the variable is defined or not, use if(varName === undefined) before other checks.
• If you know if the variable is defined and it's an object, check if is null with if(varName === null)

The strict equality operator (===) is needed because varName == undefined also checks whether varName is null

Answer 4

Please use the following if you want to check for the existence of the object in question and prevent various JS erorrs:

if (typeof(abc) === 'undefined') {
    console.log('not defined');
}

jsFiddle proving the usefulness: http://jsfiddle.net/tJyfg/1/

If you're looking to check a global variable, then the following will do the trick without using typeof() (works for all objects as well)...

if (!window.abc) {
  console.log('not defined');
}