Null vs Undefined in JavaScript

Null and undefined are primitive values in JavaScript. JavaScript uses them to indicate the no value or absence of any value. The difference between Null & Undefined is subtle and confusing. In this tutorial let us explore them

Null Vs Undefined

Null & undefined both point to no value or absence of any value. But there are a few differences between them

Definition

The value undefined means value is not assigned & you don’t know its value. It is an unintentional absence of value.

The value null indicates that you know that the field does not have a value. It is an intentional absence of value.

Take a look at the following person function which returns the person object. It has a property dateOfMarriage.

The dateOfMarriage is not a required field. If the person is married, then the field will contain a value.

If the person is not married, then the dateOfMarriage field will not have any value. To represent no value we explicitly (or intentionally) set its value as null. That is how we use null. The absence of value is intentional. We need to set the value to null explicitly.

To check whether the person is married or not we check if the value is null. If null he is married else not.

But what if no value is provided for dateOfMarriage as in the following example. In that case, JavaScript sets its value to undefined. When you encounter value undefined, it implies that you do not know whether the person is married or not.

Note that JavaScript also allows us the set the value to undefined explicitly.

Data Types

The data type of undefined value is undefined. The data type of null value is null.

But using typeof on a null variable shows it as an object. This is a very old bug in JavaScript

Setting the value

JavaScript sets the value to undefined, when it expects a value but does not find one. But it never sets the variable to null. You need to set the value of null explicitly

For Example. JavaScript automatically sets the Uninitialized variable to undefined.

The following are some of the instances where a variable gets the value undefined

  1. Uninitialized variable
  2. Function argument that has not been supplied
  3. The return value of functions that don’t return a value
  4. Non-existing object Property
  5. Non-existing array elements

Falsy

Both null & undefined is falsy value in JavaScript. i.e. when we use them in a boolean expression they are coerced to false.

But they are neither false nor true.

Comparing Null with undefined

Comparing null with undefined results in different results depending on whether you use an equality checker (==) or strict equality checker (===)

null and undefined both represents no value hence equality checker (==) returns true. This is because the equality checker does not check for data type

But strict equality checker returns false because it also checks for the data type.

Arithmetic Operations

In arithmetic operations undefined is coerced to NaN.

Null is coerced to 0.

TypeOf

The Typeof Operator returns the data type of the variable. It returns the data type of undefined correctly but returns “object” as the data type of null. This is a well-known bug in JavaScript

Null literal & Undefined global variable

Null is literal in JavaScript. It is used to represent null. We use that to compare or assign null values to a variable.

undefined is a global variable, which contains the value undefined. It is the property of the global object. Hence you can access it using the window object (only in the browser) or using the globalThis property.

Since the ES5 version, the undefined is a non-configurable, non-writable & non-enumerable property. But that does not stop someone from overriding it inside a function.

Undefined vs null. Which one to use

There are many approaches on how to use undefined & null. The simplest approach would be to use the null to indicate the no value. Use undefined to indicate that the variable is not yet assigned any value. In this use case, you should not assign undefined to any variable.

You can also use undefined to indicate the no value and never use null.

Leave a Comment

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Scroll to Top