JavaScript check if variable exists (is defined/initialized)

Question

Which method of checking if a variable has been initialized is better/correct? (Assuming the variable could hold anything (string, int, object, function, etc.))

Answer 1

To contribute to the debate, if I know the variable should be a string or an object I always prefer if (!variable), so checking if its falsy. This can bring to more clean code so that, for example:

if (typeof data !== "undefined" && typeof data.url === "undefined") {
    var message = 'Error receiving response';
    if (typeof data.error !== "undefined") {
        message = data.error;
    } else if (typeof data.message !== "undefined") {
        message = data.message;
    }
    alert(message); 
}

..could be reduced to:

if (data && !data.url) {
  var message = data.error || data.message || 'Error receiving response';
  alert(message)
} 

Answer 2

Null is a value in JavaScript and typeof null returns "object"

Therefore, accepted answer will not work if you pass null values. If you pass null values, you need to add an extra check for null values:

if ((typeof variable !== "undefined") && (variable !== null))  
{
   // the variable is defined and not null
}

Answer 3

In JavaScript, a variable can be defined, but hold the value undefined, so the most common answer is not technically correct, and instead performs the following:

if (typeof v === "undefined") {
   // no variable "v" is defined in the current scope
   // *or* some variable v exists and has been assigned the value undefined
} else {
   // some variable (global or local) "v" is defined in the current scope
   // *and* it contains a value other than undefined
}

That may suffice for your purposes. The following test has simpler semantics, which makes it easier to precisely describe your code's behavior and understand it yourself (if you care about such things):

if ("v" in window) {
   // global variable v is defined
} else {
   // global variable v is not defined
}

This, of course, assumes you are running in a browser (where window is a name for the global object). But if you're mucking around with globals like this you're probably in a browser. Subjectively, using 'name' in window is stylistically consistent with using window.name to refer to globals. Accessing globals as properties of window rather than as variables allows you to minimize the number of undeclared variables you reference in your code (for the benefit of linting), and avoids the possibility of your global being shadowed by a local variable. Also, if globals make your skin crawl you might feel more comfortable touching them only with this relatively long stick.

Answer 4

Check if window.hasOwnProperty("varname")

An alternative to the plethora of typeof answers;

Global variables declared with a var varname = value; statement in the global scope

can be accessed as properties of the window object.

As such, the hasOwnProperty() method, which

returns a boolean indicating whether the object has the specified property as its own property (as opposed to inheriting it)

can be used to determine whether

a var of "varname" has been declared globally i.e. is a property of the window.

// Globally established, therefore, properties of window
var foo = "whatever", // string
    bar = false,      // bool
    baz;              // undefined
//  window.qux does not exist

console.log( [
    window.hasOwnProperty( "foo" ), // true
    window.hasOwnProperty( "bar" ), // true
    window.hasOwnProperty( "baz" ), // true
    window.hasOwnProperty( "qux" )  // false
] );

What's great about hasOwnProperty() is that in calling it, we don't use a variable that might as yet be undeclared - which of course is half the problem in the first place.

Although not always the perfect or ideal solution, in certain circumstances, it's just the job!

Notes

The above is true when using var to define a variable, as opposed to let which:

declares a block scope local variable, optionally initializing it to a value.

is unlike the var keyword, which defines a variable globally, or locally to an entire function regardless of block scope.

At the top level of programs and functions, let, unlike var, does not create a property on the global object.

For completeness: const constants are, by definition, not actually variable (although their content can be); more relevantly:

Global constants do not become properties of the window object, unlike var variables. An initializer for a constant is required; that is, you must specify its value in the same statement in which it's declared.

The value of a constant cannot change through reassignment, and it can't be redeclared.

The const declaration creates a read-only reference to a value. It does not mean the value it holds is immutable, just that the variable identifier cannot be reassigned.

Since let variables or const constants are never properties of any object which has inherited the hasOwnProperty() method, it cannot be used to check for their existence.

Regarding the availability and use of hasOwnProperty():

Every object descended from Object inherits the hasOwnProperty() method. [...] unlike the in operator, this method does not check down the object's prototype chain.

Answer 5

The most robust 'is it defined' check is with typeof

if (typeof elem === 'undefined')

If you are just checking for a defined variable to assign a default, for an easy to read one liner you can often do this:

elem = elem || defaultElem;

It's often fine to use, see: Idiomatic way to set default value in javascript

There is also this one liner using the typeof keyword:

elem = (typeof elem === 'undefined') ? defaultElem : elem;

Answer 6

Attention :: people who don't understand the difference between a proposition let, a constant const and a variable var should refrain themselves from commenting.

These answers (aside from the Fred Gandt solution ) are all either incorrect or incomplete.

Suppose I need my variableName; to carry an undefined value, and therefore it has been declared in a manner such as var variableName; which means it's already initialized; - How do I check if it's already declared?

Or even better - how do I immediately check if "Book1.chapter22.paragraph37" exists with a single call, but not rise a reference error?

We do it by using the most powerful JasvaScript operator, the in operator.:

"[variable||property]" in [context||root] 
>> true||false

In times of AJAX peaking popularity I've written a method (later named) isNS() which is capable of determining if the namespace exists including deep tests for property names such as "Book1.chapter22.paragraph37" and a lot more.

But since it has been previously published and because of its great importance it deserves to be published in a separate thread I will not post it here but will provide keywords (javascript + isNS ) which will help you locate the source code, backed with all the necessary explanations.