To check if a variable is defined in JavaScript, you can use any of these methods –
- typeof operator
- try/catch block
- window.hasOwnProperty()
Let’s have a look at each of these methods in detail. But before that, let’s understand the difference between defined/undefined and initialized/uninitialized variables in JavaScript.
Check If A Variable Is Defined In JavaScript
defined/not defined Variable
A variable is defined when it is declared in the current scope using const, let or var operator. If a variable is not declared in the current scope, it is said to be undefined.
For example,
var a = 10; //a is defined
message; //message is undefined
var b; //b is defined
initialized/not initialized Variable
A variable is initialized when it is assigned a value. A variable can be declared and not initialized in which case it has the value undefined.
For example,
var a = 10; //a is defined and initialized
message; //message is undefined
var b; //b is defined but not initialized
Now that we know about these terms, let’s see how to check if a variable is defined in JavaScript.
typeOf Operator
The typeof operator is the most common and straightforward way to check if a variable is defined in JavaScript. If the variable is not defined, it will return “undefined”.
let x;
if (typeof x === "undefined") {
console.log("x is undefined");
} else {
console.log("x is defined");
}
Output: x is undefined
Let’s take another example,
if (typeof x === "undefined") {
console.log("x is undefined");
} else {
console.log("x is defined");
}
var x;
Output: x is undefined
As you can see in the above example, x is defined after the typeof operator is called on it, but still doesn’t return an error because x is hoisted. Hoisting is a concept in JavaScript that moves all declarations to the top of the current scope.
Even if we initialize the variable x with some value after the typeof operator, it will still return “undefined”.
if (typeof x === "undefined") {
console.log("x is undefined");
} else {
console.log("x is defined");
}
var x = 10;
Output: x is undefined
This is because the variable x is hoisted to the top, but with value ‘undefined’ before it is initialized.
Please note that you cannot hoist the variable using let or const.
if (typeof x === "undefined") {
console.log("x is undefined");
} else {
console.log("x is defined");
}
let x = 10;
This will throw an error, as x is not hoisted in this case, and the typeof operator is called on a value that doesn’t exist, as per JavaScript.
Try/Catch Block
You can also use a try/catch block to check if a variable is defined in JavaScript. The idea is to try to access the variable inside a try block and if it throws an error, we know that the variable is not defined.
try{
x;
} catch(e){
console.log("x is undefined");
}
Output: x is undefined
Please note that this method will only work if the variable is not defined, and it throws a ReferenceError. For example, if we have declared the variable x but haven’t initialized it with any value, then it won’t throw any error and “x is defined” will be logged in the console.
try{
x;
} catch(e){
console.log("x is undefined");
}
var x;
This won’t log any error because x is declared, although it is not initialized with any value. So if you want to use this method, make sure that the variable is truly undefined and not just uninitialized.
window.hasOwnProperty()
Another method to check if a variable is defined in JavaScript is using the window.hasOwnProperty() method. The idea is to first check if the window object has a property with the name of our variable and then see if it is undefined or not.
if (window.hasOwnProperty("x")) {
console.log("x is defined");
} else {
console.log("x is undefined");
}
Output: x is undefined
If x is defined, it will return true, otherwise false.
if (window.hasOwnProperty("x")) {
console.log("x is defined");
} else {
console.log("x is undefined");
}
var x;
Output: x is defined
Please note that the window object is used because it is the global object in the browser, and all global variables are properties of the window object.
If we are not in a browser and are using Node.js, then we can use the global object.
if (global.hasOwnProperty("x")) {
console.log("x is defined");
} else {
console.log("x is undefined");
}
Output: x is undefined
Conclusion
So these were some of the methods that you can use to check if a variable is defined in JavaScript. Which one you choose depends on your specific needs and requirements. But the most important thing is to be aware of the hoisting concept in JavaScript to avoid any unexpected behavior.
I hope this article was helpful and that you now know how to check if a variable is defined in JavaScript.
Happy Coding! 🙂