In JavaScript, assigning a variable to undefined or null feels the same, meaning “none”; But in practice, far from it, the lack of clarity between the two may cause some problems.

inThis articleI have already given a brief introductionundefinedandnullThe characteristics of.

This article explores the similarities and differences between undefined and NULL in JavaScript.

similarity

(1) Undefined and null are automatically converted to false in if statements. Converted to true, the equality operator is equal for both comparisons.

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

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

undefined= =null
// true
Copy the code

(2) In JavaScript, there are only six Falsy values, null and undefined are included in the six Falsy values, and all falsy values are false when performing logical judgment.

  • false
  • 0
  • “(empty string, same as “”)
  • null
  • undefined
  • NaN

Other than these six values, any other value in JavaScript is considered a Truthy value and is true when making logical judgments.

(3) Also in JavaScript, there are six primitive values, null and undefined are included in these six primitive values.

  • Boolean
  • Null
  • Undefined
  • Number
  • String
  • Symbol

Undefined and null are similar in meaning and usage, so why add another value for no reason?

Historical reasons

Recently, when reading ruan Yifeng teacher’s blog article, I got the answer from the historical factors!

When JavaScript was born in 1995, like Java, only NULL was set as a value for “none”.

In the tradition of C, NULL is designed to be automatically converted to 0.

Number(null)
/ / 0

6 + null
/ / 6
Copy the code

But Brendan Eich, the designer of JavaScript, felt this was not what he had hoped for, for two reasons.

First, NULL is treated as an object, just like in Java. However, JavaScript data types fall into primitive and complex types, and Brendan Eich felt that a value for “nothing” is best not an object.

Second, the earliest versions of JavaScript did not include error handling, and when a data type mismatch occurred, the type was automatically converted or silently failed. Brendan Eich felt that if null was automatically converted to 0, it would be hard to spot errors.

Therefore, Brendan Eich designed to add undefined.

The differences

(1) Data type difference

Undefined has only one value, undefined; The null type has only one value, NULL.

That is, undefined and null are of different data types, and both data types have only one value. Use the “typeof” operator to determine the type.

console.log(typeof undefined);  // undefined
console.log(typeof null);   // object 
Copy the code

The first line of output is fine, printing undefined correctly; The second line prints object. Isn’t null null?

This is a JS design error, the original correct result should be null, now only error, maybe a later version will fix this problem.

(2) Convert to numerical distinction

To better distinguish between the two values, the original version of JavaScript set null as an object representing “nothing” and zero when converted to a value; Undefined is a primitive value for “none”, which is NaN when converted to a value.

var a1= 5 + null;
console.log(a1)  / / 5

var a2= 5 + undefined;
console.log(a2)  // NaN
Copy the code

(3) NULL! == undefined

As you can see above, null is not the same as undefined, but there are some similarities, so the ECMAScript specification states that NULL does not strictly equal undefined.

null! = =undefined  // true

null= = =undefined  // false
Copy the code

However, as mentioned above, null loose is equivalent to undefined (to a lesser degree than ===).

null= =undefined  // true
Copy the code

In JavaScript, == applies loose equality, which means we compare two values after converting them to a generic type.

Just remember that null == undefined will return true because they are similar values; But null === undefined returns false because they are different types of values. The difference between == and === will be added later, so stay tuned.

The actual usage

However, none of the above distinctions are often used in practice. In fact, null and undefined are considered almost synonymous, with only minor differences.

Null indicates that a variable has been artificially set to an empty object instead of its original state, i.e. there should be no value there. It generally occurs in the following two scenarios:

(1) Use document.getelementById (‘ XXX ‘) to find a non-existent element, which will return NULL.

console.log(null= =document.getElementById('notExistElement'))  // true
Copy the code

(2) as the end of the object prototype chain.

Object.getPrototypeOf(Object.prototype)  // null
Copy the code

Undefined represents the natural, primitive state value of a variable, that is, there should be a value here, but it is not defined yet. It usually occurs in the following four scenarios:

(1) declare a variable, but no assignment, equal to undefined.

var a
console.log(a) // undefined
Copy the code

(2) The function defines a parameter, but does not pass an argument, which is equal to undefined.

// The function defines the parameter a
function f(a) {
     console.log(a); // undefined 
}  
f(); // No argument passed
Copy the code

(3) Access the property of the object does not exist, the value of the property is undefined.

var  a = new Object()
a.p // undefined
Copy the code

(4) If the function does not return a value, undefined is returned by default.

var a = f()
a // undefined
Copy the code

Therefore, in practical use, in order to ensure the semantics of the variable, do not explicitly assign undefined to a variable, when you need to release an object, directly assign null.

Null and undefined

Use undefined for value type nothingness and null for reference type nothingness.

My Github link is as follows. Welcome to Star

Github.com/miqilin21/m…