The difference between null and undefined in JavaScript

Most computer languages have one and only one value for “nothing”, such as NULL in C, null in Java, None in Python, and nil in Ruby.

What is strange is that JavaScript has two values for “nothing”: undefined and null.

1. Similarity

In JavaScript, assigning a variable to undefined or null makes little difference, frankly.

var a = undefined;
var a = null;

In the above code, the a variable is assigned to undefined and null, respectively, which are written in almost equivalent ways.

Both undefined and null are automatically turned to false in the if statement, and the equality operator even reports both as equal directly.

if (!undefined) {
 console.log('undefined is false'); // undefined is false
}
if (!null) {
 console.log('null is false'); // null is false
}
undefined == null // true

The above code shows how similar the behavior of both is!

If undefined and null are similar in meaning and usage, why set two such values at the same time, which increases the complexity of JavaScript for beginners?

2. Historical reasons

The answer to this question is given in Speaking JavaScript

It turns out that the history of JavaScript has something to do with the fact that when JavaScript was created in 1995, it was originally set up like Java, with only null as the value for “nothing”.

In the tradition of the C language, null was designed to be automatically converted to 0.

Number(null) // 0

5 + null // 5

However, Brendan Eich, the designer of JavaScript, felt that this was not enough for two reasons.

First, a null is treated as an object, as it is in Java. However, JavaScript’s data types are divided into two categories: primitive and complex, and Brendan Eich felt that it was better to have a value indicating “nothing” than an object.

Second, the original version of JavaScript did not include an error-handling mechanism, and when a data type mismatch occurred, the type was often converted automatically or failed silently; Brendan Eich felt that if null was automatically converted to 0, it would be difficult to detect the error.

Therefore, Brendan Eich designed an undefined again.

3. Initial Design

The original version of JavaScript distinguished between null, which is an object that means “nothing” and is converted to a value of 0, and undefined, which is a raw value that means “nothing” and is converted to a value of NaN.

Number(undefined) // NaN

5 + undefined // NaN

4. Current Usage

However, such a distinction as above soon proved infeasible in practice. Currently, null and undefined are essentially synonymous, with a few minor differences.

null means “no object”, i.e., there should be no value there. Typical usage is.

1. As an argument to a function, indicates that the function’s argument is not an object.
2. As the end of the object prototype chain.

Object.getPrototypeOf(Object.prototype) // null

undefined means “missing value”, that is, there should be a value here, but it is not defined yet, typical usage is.

1. When a variable is declared but not assigned a value, it is equal to undefined.
2. When a function is called and the parameter that should be provided is not provided, the parameter is equal to undefined.
3. The value of the property is undefined when the object is not assigned a value.
4. When a function does not return a value, it returns undefined by default.

var i;

console.log(i); // undefined 

function f(x){
   console.log(x)
} 

f() // undefined 

var o = new Object(); 

o.p // undefined 

var x = f(); 

x // undefined