JavaScript: difference between null and undefined

Programming in JavaScript, surely all we ever found us in the position of having to execute either a block of code or another depending on whether a variable is “null” or “undefined.” Today we will analyze the difference in JavaScript between “null” and “undefined“, since we have to be very careful when we compare them.

“undefined” in JavaScript

First, in order to speak about null and undefined in Javascript we need to clarify that “undefined” is a data type, as the Number, String, Boolean, Object or Array are data types as well. In Javascript, unlike other programming languages ​​with strong typing, we may have variables of type “undefined”. A priori, it may sound a little strange, but if you think about it for a moment, it makes sense since Javascript, being a weakly typed language, allows us to declare variables without specifying what will be the values ​​it contains. Thus, Javascript will consider a variable of one data type or another depending on its content, for example:

var number1 = 123; //Type Number
var number2 = "123" //Type String
var number3;

Since the variable “number3” has no assigned value, what type is it? Since all variables must always have a type, in this case Javascript considers the variable “number3” as type undefined.

In summary, in Javascript all those variables that have not been defined (hence, they do not exist in memory) or have been defined but do not have an assigned value yet, they are always of type undefined.

“null” in Javascript

In Javascript, as in many other programming languages​​, the value “null” is a special value. The null value is a value in itself, but a value that indicates the absence of content, empty value. If we write the following code:

var number1 = null;

What type is the variable “number1” now? For Javascript, since the number1 variable is assigned the null value, this is a variable of type Object now.

Comparing null and undefined

We have to be very careful when we compare variables that are assigned the null value or no values ​​assigned yet, because we can obtain wrong or misleading results from the aforesaid comparison. Suppose we have the following situation:

var variable1; //Type undefined
var variable2 = null; //Type Object, value null

And we make the following comparisons using the equality operator:

1. if (variable1 == variable2) // true, incorrect
2. if (variable1 == null) //true, incorrect
3. if (variable1 == "undefined") //false, correct

Let’s analyse each of the comparisons:

#1 and #2: Why are they evaluated as true? These comparisons are evaluated as true because for Javascript, as variable1 has no value assigned and variable2 is assigned the value empty, they are considered equal in terms of content. It is dangerous to make this comparison, because as we can see, both variables are not equal. You can make this type of comparison as long as we do not mind treating a undefined variable as if it would contain the value null.

#3: Why is it evaluated as false? This comparison evaluates to false because we are comparing a variable that has no value assigned to a literal that does have content, the string “undefined” as a word itself. Since variable1 does not contain the string “undefined”, the condition evaluates to false. If what you need is to find out whether a variable is of type “undefined”, this is not the solution.

So, how could we make such comparisons and make sure that they are evaluated correctly? To do this we use the identity (===) operator:

1. if (variable1 === variable2) //false, correct
2. if (variable1 === null) // false, correct

As we know, the identity operator not only compares the values ​​of two variables, but also makes type checking. So now I get the results correctly. When we do the comparison, since variable1 (type undefined) and variable 2 (of type Object) have different types, Javascript returns false in both cases.

To sum up

If we only need to know if a variable is null or no value has been defined, we can use the negation operator:

var data;
if (!data) //true

If we need to know whether a variable actually contains the value null, we use the identity operator:

var data = null;
if (data === null) //true

If we need to know if a variable has the type undefined, we have to use the typeof operator, which returns the type of the variable in String format:

var data;
if (typeof(data) == "undefined") //true

With this we have clarified a little more how we can compare variables that have not been assigned a value and variables with value null. We have also have learnt what really makes the difference between Javascript null and undefined.

4 thoughts on “JavaScript: difference between null and undefined

Leave a Reply

Your email address will not be published. Required fields are marked *