Explain the difference between undefined and null in JavaScript

  • 2020-03-30 02:28:50
  • OfStack

Somewhat oddly, the JavaScript language has two values for nothing: undefined and null. Why is that?

I. similarity
In JavaScript, assigning a variable to undefined or null, honestly, makes little difference.

var a = undefined;
var a = null;

In the above code, the a variable is assigned to undefined and null, which are almost equivalent.
Both undefined and null are automatically converted to false in the if statement, and the equality operator even directly reports that they are equal.

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

The code above shows how similar the behavior is!
Since both undefined and null have similar meanings and USES, why set two of these values at the same time? Isn't that an unnecessary increase in JavaScript complexity that bothers beginners? Dart, the alternative to JavaScript developed by Google, explicitly states that there is only null and no undefined!
2. Historical reasons
Recently, while reading the new book Speaking JavaScript, I stumbled across the answer to this question!
Turns out, this has to do with the history of JavaScript. When JavaScript was born in 1995, it was initially set to null as the value for nothing, just like Java.
According to the tradition of the C language, null is designed to be automatically converted to 0.

// 0
5 + null
// 5

But JavaScript designer Brendan Eich doesn't think that's enough, for two reasons.
First, null is treated as an object, just like in Java.

typeof null
// "object"

However, JavaScript's data types are divided into primitive and complex types, and Brendan Eich felt that the value for "nothing" was better not to be an object.
Second, the initial versions of JavaScript did not include error handling, and when data type mismatches occur, it is often an automatic type conversion or a silent failure. Brendan Eich felt that if null automatically went to zero, it would be difficult to detect errors.
So Brendan Eich designed another undefined.
3. Initial design
The original version of JavaScript distinguished this by saying that null is an object that represents "nothing" and is zero when converted to a value. Undefined is a primitive value for nothing, NaN when converted to a value.

// NaN
5 + undefined
// NaN

Current usage
However, the above distinction soon proved unworkable in practice. Currently, null and undefined are basically synonymous with each other, with only minor differences.
Null means "no object", that is, there should be no value there. Typical usage:
(1) as the parameter of the function, the parameter of the function is not an object.
(2) as the end of the object prototype chain.

// null

Undefined means "missing value," which means there should be a value here, but it's not defined yet. Typical usage:
(1) when the variable is declared but not assigned, it's undefined.
(2) when the function is called, the parameter that should be provided is not provided, which is equal to undefined.
(3) the object has no assigned property, the value of which is undefined.
(4) when the function returns no value, undefined is returned by default.

var i;
i // undefined
function f(x){console.log(x)}
f() // undefined
var  o = new Object();
o.p // undefined
var x = f();
x // undefined

Related articles: