The Truth About null and undefined in JavaScript (You’re Using Them Wrong!)

If you are coding in JavaScript for just 1 month or more, I am 100% sure that you already experienced the puzzle between null and undefined. These two values may be similar, but they act differently. Many developers misuse those that can leading to unexpected bugs and errors for sure.

In this article, we will identify the key differences, share real-life code examples, and list all best practices to avoid common bugs or errors. By the end, you’ll never be confused about null and undefined again!

What is undefined in JavaScript?

Definition

undefined is a special value in JavaScript that represents a variable that has been declared but not assigned a value.

Examples

1. Unassigned Variable

let x;
console.log(x); // undefined

• The variable x is declared but not assigned a value, so JavaScript considers it to undefined.

2. Missing Function Parameter

function greet(name) {
  console.log("Hello, " + name);
}
greet(); // Hello, undefined

• Since no argument was passed, name is undefined.

3. Accessing Non-Existent Object Properties

let person = { name: "Alice" };
console.log(person.age); // undefined

• The property age doesn’t exist in the object, so JavaScript returns undefined.

What is null in JavaScript?

Definition

null is an intentional absence of value. It is explicitly assigned to a variable to indicate “no value.”

Examples

1. Assigning null to a Variable

let data = null;
console.log(data); // null

• Here, we intentionally set data to null to indicate that it has no value.

2. Resetting an Object

let user = { name: "John" };
user = null;
console.log(user); // null

• Setting user = null; release memory by removing the reference to the object. Mind it bro!!

3. Null in DOM Elements

console.log(document.getElementById("nonexistent")); // null

• If an element doesn’t exist in the DOM, getElementById() returns null.

Key Differences Between null and undefined

Feature	undefined	null
Type	Primitive	Object
Default Value?	Yes, variables get undefined if no value is assigned	No, must be explicitly assigned
Intentional?	No, it happens by default	Yes, assigned on purpose
Used in?	Unassigned variables, missing object properties, function parameters	Empty object references, DOM lookups, resetting values

Common Mistakes and How to Avoid Them

❌ Mistake 1: Confusing null and undefined in Conditionals

if (variable) {
  console.log("Value exists");
} else {
  console.log("Value is missing");
}

• This works most of the time, but if variable is 0 or "" (empty string), it will also be treated as false.

✅ Best Practice: Use == null to check for both null and undefined.

if (variable == null) {
  console.log("Value is missing");
}

❌ Mistake 2: Using typeof to Check for null

console.log(typeof null); // "object"

• null is not an object but is incorrectly categorized as one due to a long-standing JavaScript bug.

✅ Best Practice: Use === null to check for null.

if (variable === null) {
  console.log("Variable is null");
}

❌ Mistake 3: Forgetting to Handle undefined in Function Parameters

function greet(name) {
  return "Hello, " + name;
}
console.log(greet()); // Hello, undefined

✅ Best Practice: Set default values.

function greet(name = "Guest") {
  return "Hello, " + name;
}
console.log(greet()); // Hello, Guest

Why Does This Matter in 2025? 🚀

While using JavaScript, understanding null and undefined is crucial for:

• Writing cleaner, bug-free code
• Avoiding unnecessary undefined errors
• Improving performance by properly managing memory

How Modern JavaScript Handles This

• Optional Chaining (?.) – Avoids undefined errors:

let user = {};
console.log(user.profile?.age); // undefined (No error!)

• Nullish Coalescing (??) – Provides fallback values:

let username;
console.log(username ?? "Anonymous"); // Anonymous

5 important FAQs about null and undefined in JavaScript

Final Thoughts 💡

• Use undefined for uninitialized variables.
• Use null when you want to indicate “no value.”
• Handle missing values carefully using optional chaining and default parameters.

if (value !== null && value !== undefined) {
  console.log("Safe to use value!");
}

🚀 Now you know the difference! Share this guide with your known developers and never misuse null and undefined again!