How to check for null, undefined or blank Variables in JavaScript ?

JavaScript is one of the most widely used programming languages in the world, powering everything from simple web pages to complex web applications. As a dynamically-typed language, JavaScript allows for the creation of variables without specifying their type, which can sometimes lead to confusion and errors when dealing with null, undefined, or blank variables. In this article, we will explore the standards and best practices for checking for these types of variables in JavaScript.

Null: A variable that is null has been explicitly set to have no value.

Syntax:

let v1 = null; 
typeof (var_); // "object"

Null was designed to represent the absence of an object or value, so it was given a special value of all zeros. This made it easy for the language to check if a variable was null since it could simply check if the value was equal to zero.

Example: When checking for null variables in JavaScript, there are several standard approaches. One of the most common is to use the triple equals (===) operator, which checks for both value and type equality.

Javascript

let var1 = null;
if (var1 === null) {
    console.log(var1);
};

Output:

null

Undefined: A variable that is undefined has not been assigned a value. When you declare a variable using let, var, or const in JavaScript, the variable is assigned the value undefined by default. This means that if you declare a variable but don’t assign a value to it, the variable’s value will be undefined.

Syntax:

let var2;
typeof (var2);
// "undefined"

Example: Here we will check the value of our variable with the help of the triple equals (===) operator.

Javascript

let var2;
if (var2 === undefined)
    console.log("true");
else
    console.log("false");

Output:

true

Blank variable: Blank variable is one that has been assigned a value, but that value is an empty string or consists only of whitespace characters. In JavaScript, a string is a sequence of characters enclosed in single or double quotes. Even if the sequence of characters in the string is just a single space, it is still considered a string, and typeof(var3) will return “string”.

Syntax:

let var3 = "";
typeof (var3)
// "string"

Example 1: When checking for blank variables, there are several different approaches depending on the specific use case. One common approach is to use the length property of a string to check if it is empty.

Javascript

let myString = "";
if (myString.length === 0) {
    console.log("myString is empty");
};

Output:

myString is empty

Example 2: Alternatively, you can use the triple equals (===) operator to check if a string is exactly equal to an empty string. 

Javascript

let myString = ''
if (myString === '') {
    console.log("myString is empty");
};

Output:

myString is empty

Example 3: If you want to check for a string that only contains whitespace characters, you can use a regular expression to test the string. 

Javascript

let myString = "    ";
if (/^\s*$/.test(myString)) {
    console.log("length of myString is: ", myString.length);
    console.log("myString has only White Spaces");
};

Output:

length of myString is:  4
myString has only White Spaces

In addition to these standard approaches, there are also several third-party libraries and frameworks that provide more advanced methods for checking for null, undefined, or blank variables. However, it’s important to keep in mind that these methods may not always be necessary and can sometimes introduce additional complexity and overhead to your code.