Null vs Undefined - Everything you need to know
Tags: webdev, javascript, beginners, tutorial
Published: 2022-12-26 10:56:48

In `JavaScript`, null and undefined are special values that represent the absence of a value or a null reference. It can be a bit confusing when it comes to a variable not having a value because it can be **null** or **undefined**. So in this article, I will break down the difference between **null** and **undefined**.

## Null vs Undefined
To start with, let me explain the similarities that they have. Both `null` and `undefined` represents that a variable has no value. If a variable has no value, it is either set to `null` or `undefined,` and the same goes for a function. If a function returns null or undefined, then this means that function has nothing to return. 

In JavaScript, null and undefined are considered loosely equal to each other, which means that the following expression will evaluate to true as it is compared with `==`:

```js
null == undefined // true
null === undefined // false
```
These are all the similarities that null and undefined have. Now lets begin the difference between them.

### Null
As I said earlier, null is a way to indicate that a variable has no value. However, `null` is an intentional assignment value, meaning that it is not a default value and must be explicitly assigned. You can think of it as a placeholder that indicates that a value is not yet known or has not been set. So a varaible can never be `null` unless a programmer set the value to null.

Here is an example that demonstrates the statement:

```js
let x;
console.log(x); // Output: undefined

let y = null;
console.log(y); // Output: null
```
This is essential to know because when you see a returned `null` value, you can be sure that the programmer who wrote the code is trying to tell you that there is no value to show or return. A great example of where `null` is useful is in something like a read function that queries a database for an entry. If no entry exists, it makes the most sense to return null since you are stating that no value is found.

### Undefined
`undefined`, on the other hand, is a value that is assigned to a variable that has not been initialized, or to an object property that does not exist. It is a default value, and it is assigned to a variable when it is declared but not assigned a value.

Here are a few examples:

```js
let x;
console.log(x); // Output: undefined

let y = null;
console.log(y); // Output: null

let z = {};
console.log(z.prop); // Output: undefined
```
In the first example, the variable `x` is declared but not initialized, so it is assigned the value `undefined`. In the second example, the variable `y` is explicitly assigned the value `null`. In the third example, the object `z` does not have a property called prop, so accessing it returns `undefined`.

This is where this gets a bit confusing as you can set a variable to undefined also.

```js
let x = null

console.log(x)
// null

x = undefined

console.log(x)
// undefined
```
You should do this to reset a variable essentially. By setting a variable to undefined, you convey that the variable no longer contains any helpful information. If the value is null, then you explicitly say the result of some action has no value.

Technically, these both indicate no value, but they express that message in slightly different ways.

---

## Conclusion
It's important to note that `null` and `undefined` are not the same thing, and they should not be used interchangeably. null is an intentional **assignment** value, while undefined is a **default** value that is assigned when a variable is not initialized or an object property does not exist.