The difference between null and undefined that you must know as JavaScript Developer.

In JavaScript, two values discretely represent nothing - undefined and null. The concrete difference between them is that null is explicit, while undefined is implicit. When a property does not exist or a variable has not been given a value, the value is undefined. null Is set as the value to explicitly indicate “no value”. In essence, undefined is used when the nothing is not known, and null is used when the nothing is known.

Now, let us discuss how null and undefined works before explaining the differences.

null

The value null represents the intentional absence of any object value. It is one of JavaScript's primitive values and is treated as false for boolean operations.

The value null is written with a literal: null. null Is not an identifier for a property of the global object, like undefined can be. Instead, null expresses a lack of identification, indicating that a variable points to no object. In APIs, null is often retrieved in a place where an object can be expected, but no object is relevant.

Code Sample:

function getVowels(str) {
  const n = str.match(/[aeiou]/gi);
  if (n === null) {
    return 0;
  }
  return n.length;
}

console.log(getVowels('sit'));
// expected output: 0

undefined

The global undefined property represents the primitive value undefined. It is one of JavaScript's primitive types.

undefined Is a property of the global object. That is, it is a variable in global scope. The initial value of undefined is the primitive value undefined.

In modern browsers (JavaScript 1.8.5 / Firefox 4+), undefined is a non-configurable, non-writable property, per the ECMAScript 5 specification. (Even when this is not the case, avoid overriding it.)

Code Sample Of JavaScript undefined:

function test(s) {
  if (s === undefined) {
    return 'Undefined value!';
  }
  return s;
}

let x;

console.log(test(x));
// expected output: "Undefined value!"

A variable that has not been assigned a value is of type undefined. A method or statement also returns undefined if the variable that is being evaluated does not have an assigned value. A function returns undefined if a value was not returned.

Note: While you can use undefined as an identifier (variable name) in any scope other than the global scope (because undefined is not a reserved word), doing so is a very bad idea that will make your code difficult to maintain and debug.

Example:

//  DON'T DO THIS

//  logs "foo string"
(function() {
  var undefined = 'foo';
  console.log(undefined, typeof undefined);
})();

//  logs "foo string"
(function(undefined) {
  console.log(undefined, typeof undefined);
})('foo');

Difference between null and undefined

When checking for null or undefined, beware of the differences between equality (==) and identity (===) operators, as the former performs type-conversion.

Code Sample:

typeof null          // "object" (not "null" for legacy reasons)
typeof undefined     // "undefined"
null === undefined   // false
null  == undefined   // true
null === null        // true
null  == null        // true
!null                // true
isNaN(1 + null)      // false
isNaN(1 + undefined) // true

Happy Coding!

I love you all.

Never give up. Stay strong.