How do I determine if 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 if I do this, the JavaScript interpreter halts execution.
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
.
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.
!==
instead of !=
.
undefined
, as any declared but uninitialized variable would, ie var someVar;
so your argument doesn't really hold up
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.
typeof
is an operator, not a function, so it doesn't need the parentheses, but I appreciate the parentheses nonetheless - simply for reading clarity.
variable == null
if (variable == null) {
// Do stuff, will only match null or undefined, this won't match false
}
undefined
evaluates equal to null
.
/*jshint eqnull:true */
to the top of your JS document or function, and JSHint will stop warning you about your uses of == null
.
==
is broken. The coercive if(variable == null)
in this answer makes complete sense to me...
if (typeof EmpName != 'undefined' && EmpName) {
will evaluate to true if value is not:
null
undefined
NaN
empty string ("")
0
false
if (EmpName)
. If it's undefined
will be falsy already.
var EmpName; if (EmpName)
. Where the variable is defined but not assigned a value.
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)
https://i.stack.imgur.com/nkpj6.png
BONUS: reason why ===
is more clear than ==
(look on agc answer)
https://i.stack.imgur.com/7MeG6.png
if(var)/if(!var)
will execute code for values true/false
. The if(var == null)
for those values of var NEVER execute code...
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 }
ReferenceError: EmpName is not defined
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');
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.
{ }
. 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
==
to ===
here, then this would be a reasonable function.
The shortest and easiest:
if(!EmpName ){
// DO SOMETHING
}
this will evaluate true if EmpName is:
null
undefined
NaN
empty
string ("")
0
false
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.
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.
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 === ''){
}
var
is a reserved word, this will throw SyntaxError
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;
ReferenceError: s is not defined
for the first example.
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';
}
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/
jQuery check element not null:
var dvElement = $('#dvElement');
if (dvElement.length > 0) {
// Do something
}
else{
// Else do something else
}
The easiest way to check is:
if(!variable) {
// If the variable is null or undefined then execution of code will enter here.
}
false
, which is potentially undesirable.
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
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';
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
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
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');
}
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.
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;
}
(null == undefined) // true
(null === undefined) // false
Because === checks for both the type and value. Type of both are different but value is the same.
Let's look at this,
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. 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
}
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) { ... }
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
}
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”.
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
var i;
if (i === null || typeof i === 'undefined') {
console.log(i, 'i is undefined or null')
}
else {
console.log(i, 'i has some value')
}
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.
I still think the best/safe way to test these two conditions is to cast the value to a string:
var EmpName = $("div#esd-names div#name").attr('class');
// Undefined check
if (Object.prototype.toString.call(EmpName) === '[object Undefined]'){
// Do something with your code
}
// Nullcheck
if (Object.prototype.toString.call(EmpName) === '[object Null]'){
// Do something with your code
}
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([]);
Success story sharing
const y = undefined; y == null;
It should returntrue
y
constant, but you ware comparingabc
(noty
). When I testedy
viaconsole.log(y == null);
on Chrome and Firefox I gottrue
as result. If you got error then maybe you tried to use assignment operator=
instead of comparison==
which would make sense to return error sinceconst
can't be reassigned.undefined !== null
--> trueundefined == null
--> true