How can I determine if a variable is 'undefined' or 'null'?

Asked 2023-09-20 20:27:07 View 106,382

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.

Answers

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.

Answered   2023-09-20 20:27:07

  • I'm trying to test if event is null in firefox and an error blocks the execution: "event is undefined" - anyone
  • @MichaelFever How does that not work? Copy paste this in your console: const y = undefined; y == null; It should return true - anyone
  • @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. - anyone
  • could be tricky: undefined !== null --> true undefined == null --> true - anyone
  • live example of relevant comparisons. lgtm. - anyone

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.

Answered   2023-09-20 20:27:07

  • 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. - anyone
  • 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. - anyone
  • -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 - anyone
  • @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 - anyone
  • @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. - anyone

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.

Answered   2023-09-20 20:27:07

  • @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. - anyone
  • what about directly checking if(variable===undefined) instead of using typeof? - anyone
  • @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 - anyone
  • This is a better solution because as @Rogue pointed out, the variable might not be declared. - anyone
  • 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? - anyone
if (variable == null) {
    // Do stuff, will only match null or undefined, this won't match false
}

Answered   2023-09-20 20:27:07

  • Just in case anybody thinks this is another half-answer, this actually does work. undefined evaluates equal to null. - anyone
  • Failed to me in chrome console... ReferenceError: variable is not defined, so it might work, but not for me... - anyone
  • 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) - anyone
  • 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. - anyone
  • @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... - anyone
if (typeof EmpName != 'undefined' && EmpName) {

will evaluate to true if value is not:

  • null

  • undefined

  • NaN

  • empty string ("")

  • 0

  • false

Answered   2023-09-20 20:27:07

  • 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. - anyone
  • Please provide a reference of this javascript especification - anyone
  • This is the same as if (EmpName). If it's undefined will be falsy already. - anyone
  • If variable is not defined. then if(EmpName) will throw error - anyone
  • @Thamaraiselvam I think Rudy might have meant this var EmpName; if (EmpName). Where the variable is defined but not assigned a value. - anyone

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

Answered   2023-09-20 20:27:07

  • Thank you, great answer! What about expressions like if(var) or if(!var) ? - anyone
  • @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... - anyone
  • Well, this is trivial, but can one of the matrices above also be used to check what the if expressions yield for different values? - anyone
  • @IceFire in my answer there is link to source of this picutres - there is also if statement "matrix" there - anyone

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 }

Answered   2023-09-20 20:27:07

  • Chrome 17.0.963.78 m gives this error: ReferenceError: EmpName is not defined - anyone
  • @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. - anyone
  • 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'); - anyone

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.

Answered   2023-09-20 20:27:07

  • 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 - anyone
  • 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. - anyone
  • You should change all of your == to === here, then this would be a reasonable function. - anyone

The shortest and easiest:

if(!EmpName ){
 // DO SOMETHING
}

this will evaluate true if EmpName is:

  • null
  • undefined
  • NaN
  • empty
  • string ("")
  • 0
  • false

Answered   2023-09-20 20:27:07

  • Use case here is that I want to know the difference between undefined and false. I will use the check on null then. - anyone

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.

Answered   2023-09-20 20:27:07

  • 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. - anyone
  • This assumes that the script is running in a browser. That's not a given. - anyone

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 === ''){
}

Answered   2023-09-20 20:27:07

  • var is a reserved word, this will throw SyntaxError - anyone
  • @dhilt implemented from var to variable - anyone

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;

Answered   2023-09-20 20:27:07

  • This did not work for me. I still got the error: ReferenceError: s is not defined for the first example. - anyone

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/

Answered   2023-09-20 20:27:07

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';
}

Answered   2023-09-20 20:27:07

  • 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. - anyone

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';

Answered   2023-09-20 20:27:07

jQuery check element not null:

var dvElement = $('#dvElement');

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

Answered   2023-09-20 20:27:07

The easiest way to check is:

if(!variable) {
  // If the variable is null or undefined then execution of code will enter here.
}

Answered   2023-09-20 20:27:07

  • This will execute the code if the variable has a value of false, which is potentially undesirable. - anyone
  • 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. - anyone
  • Sorry, but that's incorrect. Here is a JSfiddle to prove it. - anyone
  • 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 - anyone
  • 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. - anyone

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
}

Answered   2023-09-20 20:27:07

  • a?.valueOf() === undefined works reliably”…. Uh, a = {valueOf() {}}. - anyone
  • 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. - anyone

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

Answered   2023-09-20 20:27:07

  • 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?" - anyone
  • @Aerovistae, I thought I did with console.log(isDeepEqual(null, null)); and console.log(isDeepEqual(undefined, undefined)); ? - anyone

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

Answered   2023-09-20 20:27:07

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;
}

Answered   2023-09-20 20:27:07

(null == undefined)  // true

(null === undefined) // false

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

Answered   2023-09-20 20:27:07

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');
    }

Answered   2023-09-20 20:27:07

  • 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. - anyone
  • 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. - anyone
  • 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. - anyone
  • Your or statement is backwards. Checking that something is undefined would be the first step, not the second. - anyone

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
}

Answered   2023-09-20 20:27:07

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) { ... }

Answered   2023-09-20 20:27:07

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
}

Answered   2023-09-20 20:27:07

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.

Answered   2023-09-20 20:27:07

  • @noseratio-opentowork Well, you negate that and it’ll work. - anyone
  • Maybe I'm missing something, but why do you need Symbol()❓ Why not just (a ?? null) === null ❓ Or, (a ?? undefined) === undefined ❓ - anyone
  • @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. - anyone

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”.

Answered   2023-09-20 20:27:07

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

Answered   2023-09-20 20:27:07

var i;

if (i === null || typeof i === 'undefined') {
    console.log(i, 'i is undefined or null')
}
else {
    console.log(i, 'i has some value')
}

Answered   2023-09-20 20:27:07

  • What happens if the user enters the word 'undefined' ? - anyone
  • Your question is good, it show condition is true so that we need to change the option normal undefined into typeof condition. @Chuck - anyone
  • 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. - anyone
  • 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. - anyone