Check empty/undefined/null string in JavaScript

In JavaScript, you can check for an empty string using various methods. An empty string is a string that contains no characters, not even whitespace.

Using the Length Property

You can use the .length property of a string to determine its length. An empty string will have a length of 0.

const str = ""; if (str.length === 0) { console.log("The string is empty."); } else { console.log("The string is not empty."); }

Using the Not Operator (!)

The not operator (!) can be used to convert a string to a Boolean value. An empty string is falsy, so using ! will return true for an empty string and false for a non-empty string.

const str = ""; if (!str) { console.log("The string is empty."); } else { console.log("The string is not empty."); }

Using String Comparison

You can directly compare the string with an empty string using equality (===) or inequality (!==) operators.

const str = ""; if (str === "") { console.log("The string is empty."); } else { console.log("The string is not empty."); }

Trimming and Checking Length

If you want to consider strings containing only whitespace as empty, you can first trim the string to remove leading and trailing spaces, then check its length.

const str = " "; if (str.trim().length === 0) { console.log("The string is empty or contains only whitespace."); } else { console.log("The string is not empty."); }

Keep in mind that these methods will help you determine if a string is completely empty. If you want to check if a string only contains whitespace, you'll need to use the trimming approach mentioned in method 4.

Difference between empty, null, undefined and NaN


Javascript enpty String
  1. Empty String (""): An empty string is a sequence of characters with zero length. It contains no visible characters and is represented by a pair of double quotation marks with nothing in between.
  2. Null: A null value in JavaScript is an intentional absence of any value. It represents the intentional lack of value and is often used to signify that a variable or object property doesn't have a valid value.
  3. Undefined: In JavaScript, a variable that has been declared but hasn't been assigned a value yet holds the value undefined. It's the default value given to variables that are declared but not initialized.
  4. NaN (Not-a-Number): NaN is a special value that represents a value that is not a valid number. It results from operations that involve non-numeric values or undefined values that can't be interpreted as numbers.

According to ES specification, the following values will evaluate to false in a conditional context -

  1. empty string ("")
  2. null
  3. undefined
  4. NaN

This means that none of the following if statements will get executed:

  1. if ("") {}
  2. if (null) {}
  3. if (undefined) {}
  4. if (NaN) {}

Conclusion

You can check for an empty string in JavaScript by using methods like checking its length property (str.length === 0), using the not operator (!str), or comparing it directly to an empty string (str === ""). To also consider strings with only whitespace as empty, you can trim the string and then check its length (str.trim().length === 0).