Undefined vs Not Defined

Concept

undefined and “not defined” both sound like “there's nothing here,” but they describe two genuinely different situations in memory:

• undefined — undefined is a special value that means “this variable exists, but no value has been put in it yet.” Memory was reserved for the name.
• “not defined” — not a value at all, but an error message. It means this name was never reserved in memory anywhere in scope, because it was never declared. To declare a variable means to create its name with var, let or const.

Why This Matters

• It follows directly from Lesson 1's memory creation phase. This lesson gives the two possible results of that phase their proper names.
• Knowing the difference tells you instantly whether a bug is a typo (undeclared variable) or a timing issue (declared but not yet assigned).
• It teaches a useful safe pattern: checking whether a variable exists with typeof, without risking a crash. typeof is an operator (a built-in word that works on a value) that returns the type of a value as a string.
• It explains why JavaScript is called a loosely typed language, and what that means in practice.

The Room Board — An Analogy

undefined — Reserved But Empty

console.log(guestName); // undefined
var guestName;

During the memory creation phase (Lesson 1), JS reserved a slot for guestName and filled it with the placeholder value undefined — a real value in JavaScript, not an error. The variable exists; it just has no real value yet. (The engine also gives you undefined when you read an object property that does not exist, when you skip an argument in a function call, and when a function has no return value.)

Not Defined — Never Existed At All

console.log(mysteryGuest); // ReferenceError: mysteryGuest is not defined

mysteryGuest was never declared anywhere in any reachable scope. No memory was ever reserved for it, so referencing it directly throws a ReferenceError. A ReferenceError is the error type JavaScript throws when your code uses a name that it cannot find (or cannot use yet). It stops the program at that line. It is not a value you can read.

The Safe Check: typeof On An Undeclared Variable

console.log(mysteryGuest);        // ReferenceError — crashes
console.log(typeof mysteryGuest); // "undefined" — perfectly safe, no crash

null vs. undefined — Two Different Kinds Of “Nothing”

Both mean “nothing,” but they come from different sides: undefined is what JS gives you by default when it hasn't been told anything yet. null is what you give to JS yourself, on purpose, to say “I know there's nothing here.”

Where undefined Sits Among The Falsy Values

undefined is one of JavaScript's small set of falsy values. A falsy value is a value that counts as false inside a condition (a test, like the one in an if). A value that counts as true is called truthy.

if (undefined) {
  // never runs
}

Everything else — including "0" the string, an empty array [], and an empty object {} — is truthy.

Why JS Is Called Loosely Typed

let value = 101;       // number
value = "Room 101";    // now a string
value = true;          // now a boolean
value = undefined;     // now... undefined

The same variable can hold a number, then a string (text), then a boolean (true or false), with no error. A type is the kind of a value, such as number, string or boolean. JavaScript is called loosely typed because a variable's type is not fixed when you declare it. The type belongs to the value that the variable holds right now. (The exact words: types are checked while the program runs, which is dynamic typing, and JavaScript converts types automatically in some cases, for example "5" * 2 gives 10, which is weak typing.) undefined is also a type, with only one value.

1let value = 101;
2value = "Room 101";
3value = true;
4value = undefined;

The Anti-Pattern: Don't Assign undefined Yourself

// avoid this
var guestName = undefined;

// prefer this instead
var guestName; // naturally undefined, nothing extra needed
// or, if you deliberately want to represent "no value" on purpose:
var guestName = null;

Real Example — Traced Line By Line

console.log(hotelName);      // undefined — reserved, not yet assigned
console.log(typeof unknownX); // "undefined" — never declared, but typeof is safe
console.log(unknownX);       // ReferenceError: unknownX is not defined

var hotelName = "Grand Palace";
console.log(hotelName);      // "Grand Palace"

1console.log(hotelName);      // undefined
2console.log(typeof unknownX); // "undefined"
3console.log(unknownX);       // ReferenceError
4 
5var hotelName = "Grand Palace";
6console.log(hotelName);      // "Grand Palace"

1. Memory phase

   hotelName → undefined reserved. unknownX is never declared anywhere, so nothing is reserved for it at all.

2. console.log(hotelName)

   Prints undefined — the reserved slot exists, just empty so far.

3. console.log(typeof unknownX)

   Prints "undefined" — safe, because typeof does not throw on a name that was never declared.

4. console.log(unknownX)

   Throws ReferenceError: unknownX is not defined — direct access has no such safety net.

5. hotelName is assigned

   Now printing it gives the real value, "Grand Palace".

See It Live — Console & DevTools

1. Open the console

   Any page → DevTools (the debugging tools built into the browser, opened with F12) → Console tab.

2. Declare without assigning

   consoleCopy

   var guestName;
   console.log(guestName); // undefined

3. Reference something never declared

   consoleCopy

   console.log(neverDeclared); // ReferenceError, in red

4. Compare with typeof

   consoleCopy

   console.log(typeof neverDeclared); // "undefined" — no error this time

5. Set a breakpoint before any declarations run

   Open the Scope panel. You'll see guestName already listed under Global with the value undefined, even before its line has run. This shows the memory creation phase from Lesson 1.

Common Misconceptions

Interview Questions