2680

How do I determine if a variable is undefined or null?

My code is as follows:

var EmpName = $("div#esd-names div#name").attr('class');
if(EmpName == 'undefined'){
  // DO SOMETHING
};
<div id="esd-names">
  <div id="name"></div>
</div>

But when I do this, the JavaScript interpreter halts execution.

3

34 Answers 34

3537

You can use the qualities of the abstract equality operator to do this:

if (variable == null){
    // your code here.
}

Because null == undefined is true, the above code will catch both null and undefined.

14
  • 9
    I'm trying to test if event is null in firefox and an error blocks the execution: "event is undefined"
    – Entretoize
    Sep 6, 2018 at 10:32
  • 5
    @MichaelFever How does that not work? Copy paste this in your console: const y = undefined; y == null; It should return true
    – Seraf
    Mar 18, 2019 at 1:19
  • 3
    @ChrisStryczynski In example from your comment you declared y constant, but you ware comparing abc (not y). When I tested y via console.log(y == null); on Chrome and Firefox I got true as result. If you got error then maybe you tried to use assignment operator = instead of comparison == which would make sense to return error since const can't be reassigned.
    – Pshemo
    Apr 17, 2019 at 20:50
  • 6
    could be tricky: undefined !== null --> true undefined == null --> true
    – d.popov
    May 14, 2019 at 9:13
  • 4
    live example of relevant comparisons. lgtm. Aug 8, 2019 at 17:17
1378

The standard way to catch null and undefined simultaneously is this:

if (variable == null) {
     // do something 
}

--which is 100% equivalent to the more explicit but less concise:

if (variable === undefined || variable === null) {
     // do something 
}

When writing professional JS, it's taken for granted that type equality and the behavior of == vs === is understood. Therefore we use == and only compare to null.


Edit again

The comments suggesting the use of typeof are simply wrong. Yes, my solution above will cause a ReferenceError if the variable doesn't exist. This is a good thing. This ReferenceError is desirable: it will help you find your mistakes and fix them before you ship your code, just like compiler errors would in other languages. Use try/catch if you are working with input you don't have control over.

You should not have any references to undeclared variables in your code.

27
  • 55
    This will cause a ReferenceError and break execution if variable is not defined or referred to at all in the code, using typeof is safer. Jun 15, 2014 at 9:49
  • 79
    That's more of a stylistic point. If the variable hasn't been declared at all, that's really just bad writing on the part of the author. You should know whether your variable has been declared or not, that shouldn't be a question. But yes, if for some reason that's the case, this should be changed to window.variable instead of just variable, which will not cause a reference error. Typeof should be avoided. Jun 15, 2014 at 15:40
  • 10
    -OP: The statement about those comparisons being "100% equivalent" is SIMPLY WRONG, as you noted in your own EDIT, the second will cause a ReferenceError. As for the assertion: "You should not have any references to undeclared variables in your code." REALLY? Ever heard of Optional Parameters? jsfiddle.net/3xnbxfsu Jan 9, 2017 at 22:04
  • 25
    @TimothyKanski optional parameters may be undefined if they are optionally not provided, but they are most definitely declared variables. They are declared and have a value of undefined, as any declared but uninitialized variable would, ie var someVar; so your argument doesn't really hold up
    – chiliNUT
    Mar 5, 2017 at 1:14
  • 7
    @Thomas if (variable) tests truthiness. It would count out false, 0, NaN, and an empty string as well as null and undefined, so it is not the correct answer here. As for instanceof, if the questions is "IS THIS VARIABLE NULL OR UNDEFINED?" (perhaps you want the value to be null or undefined...) you cannot ascertain that with instanceof, except by checking that the value isn't an instance of any other type, which is crazy. So that is also the wrong answer here. Aug 2, 2017 at 21:01
298

Combining the above answers, it seems the most complete answer would be:

if( typeof variable === 'undefined' || variable === null ){
    // Do stuff
}

This should work for any variable that is either undeclared or declared and explicitly set to null or undefined. The boolean expression should evaluate to false for any declared variable that has an actual non-null value.

8
  • 2
    @Aerovistae I recognize that typeof is an operator, not a function, so it doesn't need the parentheses, but I appreciate the parentheses nonetheless - simply for reading clarity.
    – user664833
    Sep 4, 2014 at 23:28
  • 1
    what about directly checking if(variable===undefined) instead of using typeof? Mar 5, 2015 at 13:45
  • 4
    @ArjunU that will cause a ReferenceError if the variable isn't declared. If you don't know whether or not a variable is declared, used the above solution. If you can guarantee that the variable is at least declared, you can use variable == null
    – Rogue
    Mar 31, 2015 at 16:04
  • 3
    This is a better solution because as @Rogue pointed out, the variable might not be declared. May 13, 2016 at 11:13
  • Correct me if I am wrong, but isn't the first conditional a superset of the second one, and therefore the second conditional is superfluous?
    – March Ho
    May 31, 2016 at 3:03
193
if (variable == null) {
    // Do stuff, will only match null or undefined, this won't match false
}
9
  • 15
    Just in case anybody thinks this is another half-answer, this actually does work. undefined evaluates equal to null.
    – Chuck
    Apr 15, 2010 at 18:37
  • 4
    Failed to me in chrome console... ReferenceError: variable is not defined, so it might work, but not for me...
    – Eran Medan
    Mar 14, 2012 at 0:46
  • 52
    It only works for declared variables, not variables that may or may not be declared, which is rarely the case. (You need to use typeof + a null check for that case)
    – user216441
    Mar 15, 2012 at 0:07
  • 11
    Just figured out you can add this comment: /*jshint eqnull:true */ to the top of your JS document or function, and JSHint will stop warning you about your uses of == null. Jun 18, 2013 at 21:02
  • 3
    @Aerovistae can you point me to a reference that explicitly states that == is broken. The coercive if(variable == null) in this answer makes complete sense to me...
    – Ben Aston
    Feb 21, 2014 at 21:44
106
if (typeof EmpName != 'undefined' && EmpName) {

will evaluate to true if value is not:

  • null

  • undefined

  • NaN

  • empty string ("")

  • 0

  • false

9
  • 16
    I think this is a dangerous technique that has spread like wild fire. Because a lot of the variables that are checked could be boolean or numbers. So if the user does not fully understand the consequences, this is no good.
    – usefulBee
    Jan 20, 2016 at 21:18
  • Please provide a reference of this javascript especification
    – villamejia
    May 20, 2016 at 16:30
  • 2
    This is the same as if (EmpName). If it's undefined will be falsy already.
    – Rudy
    Nov 11, 2016 at 15:39
  • 2
    If variable is not defined. then if(EmpName) will throw error Nov 12, 2016 at 3:44
  • 1
    @Thamaraiselvam I think Rudy might have meant this var EmpName; if (EmpName). Where the variable is defined but not assigned a value.
    – hungerstar
    Nov 16, 2016 at 15:36
56

Probably the shortest way to do this is:

if(EmpName == null) { /* DO SOMETHING */ };

Here is proof:

function check(EmpName) {
  if(EmpName == null) { return true; };
  return false;
}

var log = (t,a) => console.log(`${t} -> ${check(a)}`);

log('null', null);
log('undefined', undefined);
log('NaN', NaN);
log('""', "");
log('{}', {});
log('[]', []);
log('[1]', [1]);
log('[0]', [0]);
log('[[]]', [[]]);
log('true', true);
log('false', false);
log('"true"', "true");
log('"false"', "false");
log('Infinity', Infinity);
log('-Infinity', -Infinity);
log('1', 1);
log('0', 0);
log('-1', -1);
log('"1"', "1");
log('"0"', "0");
log('"-1"', "-1");

// "void 0" case
console.log('---\n"true" is:', true);
console.log('"void 0" is:', void 0);
log(void 0,void 0); // "void 0" is "undefined" 

And here are more details about == (source here)

Enter image description here

BONUS: reason why === is more clear than == (look on agc answer)

Enter image description here

4
  • Thank you, great answer! What about expressions like if(var) or if(!var) ?
    – IceFire
    May 1, 2021 at 10:26
  • @IceFire example difference: if(var)/if(!var) will execute code for values true/false. The if(var == null) for those values of var NEVER execute code... May 1, 2021 at 11:10
  • 1
    Well, this is trivial, but can one of the matrices above also be used to check what the if expressions yield for different values?
    – IceFire
    May 1, 2021 at 11:59
  • @IceFire in my answer there is link to source of this picutres - there is also if statement "matrix" there May 1, 2021 at 19:06
33

jQuery attr() function returns either a blank string or the actual value (and never null or undefined). The only time it returns undefined is when your selector didn't return any element.

So you may want to test against a blank string. Alternatively, since blank strings, null and undefined are false-y, you can just do this:

if (!EmpName) { //do something }
3
  • 2
    Chrome 17.0.963.78 m gives this error: ReferenceError: EmpName is not defined
    – Eran Medan
    Mar 14, 2012 at 0:47
  • 10
    @EranMedan I know this is late, but it will hopefully help people who come here later. The reason you get an error is because it has not been declared at all. Usually you'd have EmpName(or some other variable) be passed into a function, or the return value of another function and therefore declared(Example: "var x;"). To test if it returned undefined, or null, or blank string, you can use the above solution.
    – Dave
    Jun 25, 2013 at 13:24
  • I realise this is a cold question, but jQuery will return undefined if the attribute doesn't exist on the element (not just just if the selector has no matching elements, as per the answer). For example, an img with no src would return undefined for $('img').attr('src'); Aug 21, 2018 at 13:13
28

Edited answer: In my opinion, you shouldn't use the function from my below old answer. Instead, you should probably know the type of your variable and use the according to check directly (for example, wondering if an array is empty? just do if(arr.length===0){} etc.). This answer doesn't even answer OP's question.


I've come to write my own function for this. JavaScript is weird.

It is usable on literally anything. (Note that this also checks if the variable contains any usable values. But since this information is usually also needed, I think it's worth posting). Please consider leaving a note.

function empty(v) {
    let type = typeof v;
    if (type === 'undefined') {
        return true;
    }
    if (type === 'boolean') {
        return !v;
    }
    if (v === null) {
        return true;
    }
    if (v === undefined) {
        return true;
    }
    if (v instanceof Array) {
        if (v.length < 1) {
            return true;
        }
    } else if (type === 'string') {
        if (v.length < 1) {
            return true;
        }
        if (v === '0') {
            return true;
        }
    } else if (type === 'object') {
        if (Object.keys(v).length < 1) {
            return true;
        }
    } else if (type === 'number') {
        if (v === 0) {
            return true;
        }
    }
    return false;
}

TypeScript-compatible.


This function should do exactly the same thing like PHP's empty() function (see RETURN VALUES)

Considers undefined, null, false, 0, 0.0, "0" {}, [] as empty.

"0.0", NaN, " ", true are considered non-empty.

3
  • 2
    I have run into a little null checking problem. I want to check if a parameter being passed is null, or an empty object { }. This is a common and silly language problem, but I had forgotten about it. All my searches show answers for undefined of null value, or loose equality comparisons ( == ), but not strict equality ( === ) or equivalent. And then here in your -1 ranked answer at the very bottom of the page (before I upvoted) is the answer that eluded me. Object.keys( obj ).length < 1 or maybe === 0, assuming it will never be -1. Anyways, upvoted to 0, woo. :p
    – user2895783
    May 22, 2016 at 15:40
  • Thanks, I've been able to drop this function in and clean up a lot of code. Why this isn't a standard JS function is beyond me.
    – Andy
    Jun 4, 2017 at 17:25
  • 4
    You should change all of your == to === here, then this would be a reasonable function. Jun 6, 2017 at 23:48
25

The shortest and easiest:

if(!EmpName ){
 // DO SOMETHING
}

this will evaluate true if EmpName is:

  • null
  • undefined
  • NaN
  • empty
  • string ("")
  • 0
  • false
1
  • 3
    Use case here is that I want to know the difference between undefined and false. I will use the check on null then.
    – gast128
    Sep 16, 2019 at 14:39
15

If the variable you want to check is a global, do

if (window.yourVarName) {
    // Your code here
}

This way to check will not throw an error even if the yourVarName variable doesn't exist.

Example: I want to know if my browser supports History API

if (window.history) {
    history.back();
}

How this works:

window is an object which holds all global variables as its properties, and in JavaScript it is legal to try to access a non-existing object property. If history doesn't exist then window.history returns undefined. undefined is falsey, so code in an if(undefined){} block won't run.

2
  • 3
    Readers should note that an approach like this is idiomatic for checking - from JavaScript running in a browser - whether a global variable has been declared, and especially whether a browser-provided global (like the history API) is available. It will not work for checking whether a non-global variable is null or undefined, nor will it work if your JavaScript is running outside a browser (i.e. in Node.js). It will also treat globals set to 0, false or '' the same as those which are undeclared or undefined or null, which is usually fine.
    – Mark Amery
    Feb 5, 2015 at 20:33
  • This assumes that the script is running in a browser. That's not a given. Oct 11, 2016 at 11:10
13

In JavaScript, as per my knowledge, we can check an undefined, null or empty variable like below.

if (variable === undefined){
}

if (variable === null){
}

if (variable === ''){
}

Check all conditions:

if(variable === undefined || variable === null || variable === ''){
}
2
  • 1
    var is a reserved word, this will throw SyntaxError
    – dhilt
    Mar 16, 2020 at 23:30
  • @dhilt implemented from var to variable Jul 1, 2020 at 7:39
10

Since you are using jQuery, you can determine whether a variable is undefined or its value is null by using a single function.

var s; // undefined
jQuery.isEmptyObject(s); // will return true;

s = null; // defined as null
jQuery.isEmptyObject(s); // will return true;

// usage
if(jQuery.isEmptyObject(s)){
    alert('Either variable: s is undefined or its value is null');
}else{
     alert('variable: s has value ' + s);
}

s = 'something'; // defined with some value
jQuery.isEmptyObject(s); // will return false;
1
  • This did not work for me. I still got the error: ReferenceError: s is not defined for the first example.
    – Mark
    May 19, 2016 at 22:14
10

You can simply use the following (I know there are shorter ways to do this, but this may make it easier to visually observe, at least for others looking at the code).

if (x === null || x === undefined) {
 // Add your response code here, etc.
}

source: https://www.growthsnippets.com/how-can-i-determine-if-a-variable-is-undefined-or-null/

9

I've just had this problem i.e. checking if an object is null.
I simply use this:

if (object) {
    // Your code
}

For example:

if (document.getElementById("enterJob")) {
    document.getElementById("enterJob").className += ' current';
}
1
  • 3
    it would be better to set var A = document.getElementById("enterJob") if(A)A.className+= ' current'; this way you do 50% work for same result... But maybe you just did it for shows and then I salute. Nov 18, 2013 at 22:40
7

With the newest javascript changes, you can use the new logical operator ??= to check if the left operand is null or undefined and if so assign the value of right operand.

SO,

if(EmpName == null){  // if Variable EmpName null or undefined
  EmpName = 'some value';
};

Is equivalent to:

EmpName ??= 'some value';
5

jQuery check element not null:

var dvElement = $('#dvElement');

if (dvElement.length  > 0) {
    // Do something
}
else{
    // Else do something else
}
4

The easiest way to check is:

if(!variable) {
  // If the variable is null or undefined then execution of code will enter here.
}
5
  • 1
    This will execute the code if the variable has a value of false, which is potentially undesirable.
    – byxor
    Jun 29, 2019 at 16:23
  • The question is clear "How to determine if variable is 'undefined' or 'null'?" and in javascript if a variable has a value of null or undefined,its value is false.
    – M. Arnold
    Jul 1, 2019 at 6:14
  • 2
    Sorry, but that's incorrect. Here is a JSfiddle to prove it.
    – byxor
    Jul 1, 2019 at 13:09
  • By your answer, undefined, null and a few other things like empty string, +0, -0 NaN and false get through. ! operator coerces the operand- here variable- to Boolean: ecma-international.org/ecma-262/#sec-toboolean
    – Alireza
    Jul 31, 2019 at 19:02
  • But check the question: "How to determine if a variable is undefined or null", the ! operand used with an if will always return to true if the variable is null or undefined.
    – M. Arnold
    Aug 1, 2019 at 6:36
4

No one seems to have to posted this yet, so here we go:

a?.valueOf() === undefined works reliably for either null or undefined.

The following works pretty much like a == null or a == undefined, but it could be more attractive for purists who don't like == 😎

function check(a) {
  const value = a?.valueOf(); 
  if (value === undefined) {
    console.log("a is null or undefined");
  }
  else {
    console.log(value);
  }
}

check(null);
check(undefined);
check(0);
check("");
check({});
check([]);

On a side note, a?.constructor works too:

function check(a) {
  if (a?.constructor === undefined) {
    console.log("a is null or undefined");
  }
}

check(null);
check(undefined);
check(0);
check("");
check({});
check([]);


Updated: we worked out a better way with a fellow StackOverflow member.

I'd personally do:

if (Object.is(a ?? null, null)) {
  // a is null or undefined
}
2
  • a?.valueOf() === undefined works reliably”…. Uh, a = {valueOf() {}}. May 29, 2023 at 23:15
  • Yeah you should have also mentioned a = Object.create(null), which could be a less silly but equally useless thing. It isn't a bug a human could introduce by mistake, it has to be done on purpose. Otherwise, yes, it's JavaScript and you can hack it however you want.
    – noseratio
    May 30, 2023 at 0:29
3

With the solution below:

const getType = (val) => typeof val === 'undefined' || !val ? null : typeof val;
const isDeepEqual = (a, b) => getType(a) === getType(b);

console.log(isDeepEqual(1, 1)); // true
console.log(isDeepEqual(null, null)); // true
console.log(isDeepEqual([], [])); // true
console.log(isDeepEqual(1, "1")); // false
etc...

I'm able to check for the following:

  • null
  • undefined
  • NaN
  • empty
  • string ("")
  • 0
  • false
2
  • This does not answer the question, which is "how do I catch null and undefined?" not "how do I catch every falsey value in JavaScript?" Feb 13, 2018 at 18:25
  • @Aerovistae, I thought I did with console.log(isDeepEqual(null, null)); and console.log(isDeepEqual(undefined, undefined)); ? Mar 22, 2018 at 16:28
3

I run this test in the Chrome console. Using (void 0) you can check undefined:

var c;
undefined
if (c === void 0) alert();
// output =  undefined
var c = 1;
// output =  undefined
if (c === void 0) alert();
// output =   undefined
// check c value  c
// output =  1
if (c === void 0) alert();
// output =  undefined
c = undefined;
// output =  undefined
if (c === void 0) alert();
// output =   undefined
3

if you create a function to check it:

export function isEmpty (v) {
 if (typeof v === "undefined") {
   return true;
 }
 if (v === null) {
   return true;
 }
 if (typeof v === "object" && Object.keys(v).length === 0) {
   return true;
 }

 if (Array.isArray(v) && v.length === 0) {
   return true;
 }

 if (typeof v === "string" && v.trim().length === 0) {
   return true;
 }

return false;
}
2
(null == undefined)  // true

(null === undefined) // false

Because === checks for both the type and value. Type of both are different but value is the same.

2

To test if a variable is null or undefined I use the below code.

    if(typeof sVal === 'undefined' || sVal === null || sVal === ''){
      console.log('variable is undefined or null');
    }
4
  • Close but no. Lose the typeof and compare to undefined straight out, not as a string. This works but the extra operator has no effect but to make it wordier. Apr 4, 2016 at 16:09
  • In this case yes you are right we don't need to use typeof. But it's a good practice to use typeof when you are dealing with undefined variables. One reason to use typeof is that it does not throw an error if the variable has not been declared.
    – DanKodi
    Apr 5, 2016 at 2:29
  • That's actually a bad thing. You don't want undeclared variables in your code. You want that to throw a ReferenceError so you can find the variable and declare it. Certainly you wouldn't try that in a compiled language like C++! Just because JS allows it doesn't mean it should be done. Apr 5, 2016 at 4:21
  • 1
    Your or statement is backwards. Checking that something is undefined would be the first step, not the second. May 21, 2016 at 15:32
2

Let's look at this,

  1.  

    let apple; // Only declare the variable as apple
    alert(apple); // undefined
    

    In the above, the variable is only declared as apple. In this case, if we call method alert it will display undefined.

  2.  

       let apple = null; /* Declare the variable as apple and initialized but the value is null */
       alert(apple); // null
    

In the second one it displays null, because variable of apple value is null.

So you can check whether a value is undefined or null.

if(apple !== undefined || apple !== null) {
    // Can use variable without any error
}
2

The foo == null check should do the trick and resolve the "undefined OR null" case in the shortest manner. (Not considering "foo is not declared" case.) But people who are used to have 3 equals (as the best practice) might not accept it. Just look at eqeqeq or triple-equals rules in eslint and tslint...

The explicit approach, when we are checking if a variable is undefined or null separately, should be applied in this case, and my contribution to the topic (27 non-negative answers for now!) is to use void 0 as both short and safe way to perform check for undefined.

Using foo === undefined is not safe because undefined is not a reserved word and can be shadowed (MDN). Using typeof === 'undefined' check is safe, but if we are not going to care about foo-is-undeclared case the following approach can be used:

if (foo === void 0 || foo === null) { ... }
1

You can do something like this, I think its more efficient for multiple value check on the same variable in one condition

const x = undefined;
const y = null;
const z = 'test';

if ([undefined, null].includes(x)) {
  // Will return true
}

if ([undefined, null].includes(y)) {
  // Will return true
}

if ([undefined, null].includes(z)) {
  // Will return false
}
1

You can do (value ?? null) === null as well if you’d like to stick with the === operator and clarify the code.


So, three ways, so far.

  • value == null
  • value === null || value === undefined
  • (value ?? null) === null

I usually avoid ==, but this time, I’d prefer == null.

3
  • @noseratio-opentowork Well, you negate that and it’ll work. May 30, 2023 at 8:59
  • 1
    Maybe I'm missing something, but why do you need Symbol()❓ Why not just (a ?? null) === null ❓ Or, (a ?? undefined) === undefined
    – noseratio
    May 30, 2023 at 12:51
  • 1
    @noseratio-opentowork Thank you for pointing it out. I unnecessarily overcomplicated it and I don’t understand myself when I wrote it either. Maybe I was tried to check if it was coalesced into the second operand. May 30, 2023 at 17:30
0

Calling typeof null returns a value of “object”, as the special value null is considered to be an empty object reference. Safari through version 5 and Chrome through version 7 have a quirk where calling typeof on a regular expression returns “function” while all other browsers return “object”.

0
var x;
if (x === undefined) {
    alert ("only declared, but not defined.")
};
if (typeof y === "undefined") {
    alert ("not even declared.")
};

You can only use second one: as it will check for both definition and declaration

0
var i;

if (i === null || typeof i === 'undefined') {
    console.log(i, 'i is undefined or null')
}
else {
    console.log(i, 'i has some value')
}
4
  • 3
    What happens if the user enters the word 'undefined' ?
    – Chuck
    Dec 7, 2016 at 13:03
  • Your question is good, it show condition is true so that we need to change the option normal undefined into typeof condition. @Chuck Dec 7, 2016 at 13:58
  • This is wrong. typeof will never yield undefined, only the string 'undefined'. Moreover, i == null is already true if i is undefined, so the second boolean would be redundant even if it worked. Sep 17, 2017 at 21:19
  • 2
    This solution (with the conditions reversed) was already provided by @jkindwall on Oct 11, 2013. stackoverflow.com/a/19323555/2943403 This code-only post is completely useless because it adds no new value to the page. In fact, it is adding page bloat and wasting researchers time reading it. Please remove this answer. May 24, 2018 at 0:40

Not the answer you're looking for? Browse other questions tagged or ask your own question.