loading...

๐Ÿ’ก How to check if a variable is undefined in JS

github logo ใƒป1 min read

codesnacks (18 Part Series)

1) Arguments and Parameters - do you know the difference? 2) Colorful console.log in JavaScript 3 ... 16 3) JavaScript Dates in SQL 4) ๐Ÿ“…๐Ÿ“… How to compare Dates in JS (getting the difference in days) 5) โœ’๏ธ Some ๐Ÿ”ฅ tips on using the JS console (console.log & console.table) 6) const ๐Ÿ“ฆ, seal ๐Ÿค, freeze โ„๏ธ & immutability ๐Ÿค“ in JS 7) ๐Ÿ›ธ Is JavaScript using pass by value or pass by reference? Let's find out! 8) The pitfalls ๐Ÿ•ณ๏ธ of cloning objects in JS (with Object.assign & object spread) 9) Do you know what ๐Ÿ“ฆ Autoboxing in JS is? 10) ๐Ÿค” Check if an object is empty in JS 11) Coercion in JavaScript - ๐Ÿค” do you know what it is? 12) ๐Ÿ’ก Dealing with command line arguments in Node.js 13) ๐Ÿš€ Get better at web development: CodeSnacks ๐Ÿซ๐Ÿช๐Ÿฉ Tutorial Tuesday Newsletter + one sweet JS hack! 14) ๐Ÿ’ก IIFE - Immediately Invoked Function Expressions in JavaScript 15) ๐Ÿ’ก How to check if a variable is undefined in JS 16) ๐Ÿ’ก How to dynamically create and access properties on JavaScript objects 17) ๐ŸคซHow to handle ๐Ÿ—๏ธ secrets ๐Ÿ—๏ธ in Node.js (Video Tutorial) 18) JS - ๐Ÿ’ก Merging multiple objects into one

How do I check if a variable is undefined in JavaScript?

tldr

typeof xyz === "undefined"
// ==> true

You might be tempted to check a variable with something like

if(!xyz) {
    // this will NOT WORK! It crashes because xyz is not defined
    console.log("not defined");
}

Doing so will lead to an error like the following:

Uncaught ReferenceError: xyz is not defined

So the solution is, as already mentioned to use the typeof operator

twitter logo DISCUSS (8)
markdown guide
 
 

I guess typeof has some builtin error handling. TIL.

xyz === undefined // throws Uncaught ReferenceError: xyz is not defined

typeof xyz === undefined // false

Edit: Interestingly, your suggestion works if the variable is in the โ€œtemporal dead zoneโ€

xyz === undefined // true
typeof xyz === undefined // false
var xyz

Edit 2: Buuuuut, the above doesnโ€™t work with block scoped variables!!

xyz === undefined // throws ReferenceError: Cannot access 'xyz' before initialization
typeof xyz === undefined // throws ReferenceError: Cannot access 'xyz' before initialization
let xyz
 

I was too quick - what I meant was:

In other words - it works when qualified (if not in browser global scope, replace "window" with whatever xyz belongs to).

I have done this countless times and never thought to use typeof - which is why I felt the need to comment :-)

I see - but this is different. You're trying to access a non-existent property on a global object. That's of course not throwing a "Reference not defined" error, that's true.

 

I'm wondering why would you add a variable inside an if if you didn't at least declared or received that variable as a parameter.

 

It might be because you don't know if a variable is declared or not. e.g. You have a global window object in the browser, but not in Node.js

 

Wait, pardon my ignorance but isn't undefined a 'falsy' value? Based on my own local testing, this won't throw an error. I do however agree that implicit boolean testing is not a best practice.

 

In my opinion, it's better to introduce the problem first then give the solution at the end of the article.

Thank you

Classic DEV Post from May 23 '19

What are you "old enough to remember" in software development?

Benjamin Mock profile image
I'm Ben, a Frontend Developer from Germany working at ebay