Null & undefined

Null is a common concept within programming, found in a LOT of programming languages. It's often stylized as NULL or null, and in some programming languages, they have changed the name to "nil" or "none", but it means the same: Nothing. The concept of null is also called a null pointer or a null reference, because it's basically pointing to something that doesn't (yet) have a value.

null

In JavaScript, null is also considered a primitive type - you can assign the value of null to a variable, and you can compare a variable to the value of null, to see if this variable can be considered null or not. For instance, if you declare a variable, which you plan to assign a value to later on, you may initialize it with the value of null:

let v = null;

If you check the value of this variable, you will see that it's equal to null:

let v = null;
alert(v == null);

However, if you declare a variable, without assigning anything to it, it is in fact also equal to null:

let v;
alert(v == null);

That makes sense, because as we have already discussed, null can be considered something that points to nothing. But does that mean that these two methods results in a completely identical variable?

undefined

Actually, no - in JavaScript, a variable declared with no initial value is not exactly the same as a variable declared with null as the value. In many programming languages, there would be no distinction between the two, and if you use regular comparison (as we did in the examples above), there doesn't appear to be any difference here either, but there are.

The reason is that in JavaScript, we have the concept of "undefined" to express just what the name indicates: Something that has not been defined yet. The distinction between null and undefined can be quite difficult to understand for people new to programming, but sometimes even more to people who are already fluent in another programming language where there's only one type of "nothing".

But first of all, allow me to prove that they are not the same in JavaScript. We will need to use the strict equality operator (===) for this, because the regular equality operator (==) will not see the difference. Here's an example:

let v1 = null;
let v2;
alert("v1 equality: " + (v1 == null));	// true
alert("v2 equality: " + (v2 == null));	// true
alert("v1 strict equality: " + (v1 === null));	// true
alert("v2 strict equality: " + (v2 === null));	// false

As you can see, as soon as I switch to the strict equality operator, v2 does not equal null, but using the regular equality operator, it is considered the same as null. And in most situations, you won't really need to differentiate between the two.

But when you do, you can compare against the global undefined property, which holds the primitive value of undefined. When we do that, we'll see something that might make things even more confusing: A variable initialized with null as the value, can still be considered "undefined" when we use the regular, non-strict equality operator:

let v1 = null;
let v2;
alert("v1 equality: " + (v1 == undefined));	// true
alert("v2 equality: " + (v2 == undefined));	// true
alert("v1 strict equality: " + (v1 === undefined));	// false
alert("v2 strict equality: " + (v2 === undefined));	// true

If you're a bit confused at this point, I completely understand. This has much to do with the dynamic type system of JavaScript and how it will often do type conversion for you, trying to help you. In this case though, it does add quite a bit of confusion, but luckily, we won't have to deal with it a lot - most of the times, it's enough to know if something can be considered null, even if it is in fact undefined.

Summary

In programming generally, and in JavaScript as well, null is the same as "nothing", and can be assigned to variables and checked against. JavaScript adds another concept called undefined, and in this article, we have highlighted the differences, even though they are not always important.