As a newbie JavaScript developer who might have encounter 2 values null and undefined while dealing with variables. They both represent something which is empty or missing but they are not the same. Understanding the difference between null and undefined will make you a better JavaScript Developer.
In this article, we’ll understand the difference between null and undefined with simple examples.
What is undefined?
undefined means a variable has been declared but no value is assigned to the variable. Its a default value given to variable by JavaScript Engine.
let x; // x is declared but not assigned a value console.log(x); // Output: undefined
In above code example we have declared x but not assigned any value to it. Therefore JavaScript automatically assigns undefined to x.
Here are few more examples of undefined.
In the below code example we are trying to access a non existent property.
let person = {}; console.log(person.age); // Output: undefined (age property doesn't exist)
Also look at the below code example here we are assigning a function call to a variable without return statement.
function greet() { console.log("Hello!"); } let result = greet(); // This function doesn't return anything console.log(result); // Output: undefined
What is null?
null is a value that represents “nothing” or “empty”. Unlike undefined
, it’s an assigned intentionally to a variable. You can think of it as a way to indicate that a variable should be empty or have no value.
let y = null; console.log(y); // Output: null
As you can see in the above code example. We are explicitly assigning null to y meaning we are saying that y has no value.
Let’s play a game try to guess the output of the below code.
let x; let y = null; console.log(typeof x); console.log(typeof y);
If you have guessed line number 3 will log undefined and line number 4 will log object to console then you are absolutely right.
The fact that typeof null returns object is a known bug in JavaScript. It has existed since the beginning of the language and remains for backward compatibility.
Key differences between null and undefined
undefined | null | |
---|---|---|
Type | undefined | object |
Meaning | Variable is declared but not assigned a value. | Variable has assigned null value. |
Assigned by | JavaScript (default) | Developer (manually) |
Try to guess the output of the below code snippet.
let x; let y = null; console.log(x==y) console.log(x===y)
If you guessed line number 3 will log true and line number 4 will log false to console then you are right. Here is why:
==
(loose equality) considers bothnull
andundefined
loosely equal because they represent an absence of value.===
(strict equality) checks both the value and the type, sonull
andundefined
are not strictly equal.
Conclusion
In summary, undefined
means a variable has been declared but hasn’t been assigned a value yet, whereas null
is an intentional assignment to indicate “no value.” Understanding these differences is key to writing cleaner, more predictable code in JavaScript.